Сортировка с помощью JavaScript drag'n'drop

Нормальный веб-дизайнер-проектировщик знает почти всё о разработке сайтов. Это не «поверхностный» человек. Он не гонится за модой а, наблюдает за «глубинными» процессами, понимает причины явлений.

В наше безумное время любой новый функциональный сайт обвешан тегами и называется «социальной сетью». Веб-дизайнера такие вещи должны мало волновать, ведь он действительно понимает, как можно использовать «Аякс» на благо человечества, и что еще можно делать с помощью JavaScript.

А вот и пример: страницы CMS Drupal компонуются из блоков. Для каждого «кирпичика» указываете вес и область размещения на странице. Выглядит это так.

Если у вас всего пять блоков, то проблем нет. Но при необходимости отсортировать двадцать блоков в одной области придется попотеть. Ошибка может стоить слишком дорого: отсортируйте последовательность, присвоив элементам вес от «-10» до «9», а потом попробуйте вставить блок вторым сверху. Hint: придется изменить вес девятнадцати блоков.

Ситуация не такая уж надуманная. Мне кажется, сортировка товаров в каталогах интернет-магазинов часто делается похожим образом, с необходимостью прописывать вес вручную.

Неновая альтернатива: JavaScript реализация drag’n’drop — «перетаскивание» объектов, как в операционных системах с развитым графическим интерфейсом. Просто перемещаете «картинки» с изображением оборудования, нажимаете на кнопку «Изменить» и готово.

Да, вот еще что. Я подумал, и решил, что буду называть проектировщиков сайтов «веб-дизайнерами», несмотря на стереотипы.

Обновление 16.02.2007. Как сделать JavaScript drag'n'drop у себя на сайте

Примеры и код сортировки элементов в списке и в двумерной таблице перетаскиванием.

Реализация drag'n'drop в script.aculo.us.