jquery droppable на основе условия

Ниже мой код.

$(document).ready(function(){ $("#container li").draggable({ revert: 'invalid' }); var total = 0; $("#selected ul").droppable({ drop: function(e, ui) { $(ui.draggable).css({ top: 0, left: 0 }).appendTo(this); }, accept: function() { return $("#selected li").length < 5; }, placeholder: true }); $("#container ul").droppable({ drop: function(e, ui) { $(ui.draggable).css({ top: 0, left: 0 }).appendTo(this); }, placeholder: true }); }); 

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

Итак, что мне делать, чтобы сделать LI сортируемым?

Вот ссылка: http://www.jsfiddle.net/nick_craver/HemSU/1/

Пожалуйста, помогите решить эту проблему. Благодарю.

Для того, что вам нужно (очень отличается от исходного вопроса), более .sortable() , например:

 $(document).ready(function(){ function checkMax() { var max = $("#selected li").length >= 5; $("#container ul").sortable("option", { revert: max, connectWith: max ? '' : '#selected ul' }); } $("#selected ul").sortable({ connectWith: '#container ul', receive: checkMax }).disableSelection(); $("#container ul").sortable({ connectWith: '#selected ul', receive: checkMax }).disableSelection(); }); 

Вы можете проверить это здесь .

Ну, вы присоединяетесь к UL, это значит, что это закончится последним.

Если вы хотите, чтобы вставить его в определенное место в списке, вы, вероятно, должны иметь LI как droppable, а не UL.

И тогда пользователь вставит перед этим LI вместо добавления.