Сортируемый пользовательский интерфейс jQuery - невозможно перетаскивать элементы в конец подключенного списка / столбца - PullRequest
Новая
       3

Сортируемый пользовательский интерфейс jQuery - невозможно перетаскивать элементы в конец подключенного списка / столбца

19 голосов
/ 25 марта 2010

У меня проблема с сортировкой jQuery. Я использую его для разработки iGoogle-подобной панели инструментов, создав 3 столбца. Все 3 содержат сортируемые элементы div и связаны друг с другом с помощью опции connectWith.

Проблема, с которой я сталкиваюсь, заключается в том, что я пытаюсь сбросить div в нижней части сортируемой колонки; это просто не хочет происходить. Это работает только в том случае, если я перетаскиваю его поверх самого нижнего элемента div, который уже есть в списке, в который я перетаскиваю.

Есть ли способ избежать этого? Или, может быть, создать фиктивный div, закрепленный в нижней части каждого столбца? ЛЮБАЯ помощь по этому вопросу была бы ОЧЕНЬ признательна!

Заранее спасибо.

Ответы [ 2 ]

44 голосов
/ 27 июня 2013

Старый вопрос, но возможно, чтобы помочь другим ...

Заполнение работает, но меняет ваше визуальное обращение.

Другое решение - использовать «допуск», предоставляемый сортируемым API. Значение допуска 'указатель' означает, что пока курсор пользователя находится над одним из других элементов, элемент может заменить свою позицию (вместо того, чтобы быть определенным количеством места над элементом, что является причиной возникновения проблем без заполнения) .

Попробуйте добавить это к вашей инициализации (в моем примере я сортирую список по вертикали). 

      $(this.$el).sortable({
            axis: 'y',
            cursor: 'move',
            containment: 'parent',
            tolerance: 'pointer' // this is the important bit
        });

Это должно быть очень быстро после того, как вы это сделаете.

Также вы можете увидеть документ jquery здесь: http://api.jqueryui.com/sortable/#option-tolerance

10 голосов
/ 30 июля 2010

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

...