0

I need to maintain the exact counts of items in some sortable lists and am having trouble doing it. The moment I start dragging from list #1 that count increments and there is an extra item in play from then on. The moment I hover over list #2 it's count increments.

Example, click for fiddle:

$(function () {
    $("#ul1, #ul2").sortable({
        connectWith: ".connectedSortable"
    }).disableSelection();
  });

function update_counts() {
    var n_ul1 = $("#ul1 li").length;
    var n_ul2 = $("#ul2 li").length;
    $("#count1").html(n_ul1);
    $("#count2").html(n_ul2);
}

$(function () {
    $("#ul2,#ul1").droppable({
        over: function (ev, ui) {
            update_counts();
        },
        drop: function (ev, ui) {
            update_counts();
        }
    }).disableSelection();
});
user1455270
  • 113
  • 1
  • 9

1 Answers1

1

I shall answer my own question:

function update_counts() {
    var n_ul1 = $("#ul1 li").not(".ui-sortable-helper").length;
    var n_ul2 = $("#ul2 li").not(".ui-sortable-helper").length;
    $("#count1").html(n_ul1);
    $("#count2").html(n_ul2);
}

.not(".ui-sortable-helper") is what was needed.

user1455270
  • 113
  • 1
  • 9
  • Please mark it as accept to indicate that the question is solved. don't leave it unanswered forever... – T J Aug 11 '14 at 07:31
  • When you answer your own question you have to wait 2 days to be able to accept the answer. – user1455270 Aug 11 '14 at 11:22
  • I'll also add that, although the above solution makes the example, work beautifully in the app I'm working on .ui-sortable-helper is not the class that my dragged item has, it's .ui-state-default for some reason so it doesn't work there. – user1455270 Aug 11 '14 at 11:27