I am trying to create an application that has some sortable lists. There is a list of categories that are sorted, and each category has a list of items that are also sorted. Here is my javascript:
$(function() { $( ".items" ).sortable({ connectWith: ".items", placeholder: 'item placeholder', }); $( ".categories" ).sortable({ connectWith: ".categories", placeholder: { element: function(currentItem) { return $('<div class="category placeholder"></div>')[0]; }, update: function(container, p) { container.refreshPositions(); return; } } }); $( ".items" ).disableSelection(); $( ".categories" ).disableSelection(); });
See this jsfiddle for reference: http://jsfiddle.net/conman124/GmDBw/
The problem I am facing is that moving an item from one category to the bottom is not easy. It seems you need to drag it to be the second by last item in the list, and then you can move it down. I looked at this ( jQuery UI sortable - failed to drag items to the bottom of the linked list / column ), a similar question and adding an add-on at the bottom, as in this the question did not seem to fix it.
Does anyone have any suggestions for fixing this issue?
source share