There is a list with checkbox:

<ul class="attach-list"> <li><input type="checkbox" name="items[]"> Item 1</li> <li><input type="checkbox" name="items[]"> Item 2</li> <li><input type="checkbox" name="items[]"> Item 3</li> <li><input type="checkbox" name="items[]"> Item 4</li> </ul>

You need to make the ability to drag and drop only the selected list items. Now the entire list is being dragged - both selected and unselected:

 $(".attach-list").draggable({ helper: clone, .... });

I do this:

 $(".attach-list").draggable({ helper: function() { return $('input[name="items[]"]:checked').closest('li'); }, ..... });

The problem is that when you move an element disappears from the list, i.e. helper works like original, but you need to be like clone.

    1 answer 1

    All figured out himself. This is how it works:

     helper: function (e, ui) { ul = $(this).clone(true); ul.find('li').each(function() { if ($(this).find('input').prop('checked') === false) { $(this).remove(); } }); return ul; },