jQuery UI sortable的serialize方法排除了一个项目

Question

我正在使用jQuery UI sortable来获取页面上的元素列表,每次更改时,我希望将其保存在数据库中.

但是,我遇到了一个奇怪的错误(在我看来像是一个):serialize和toArray方法总是从生成的序列化字符串(或数组)中排除一个项目.这始终是当前拖动的项目.这意味着订单永远不会被正确跟踪.

这是我的javascript示例:

$('.setContent').sortable({change:

    function(event, ui) {

        // Serialise the new order
        var newOrder = $('.setContent').sortable('serialize');

        // Add the current set id and the action name
        newOrder += '&setId='+currentSet+'&action=usrStuff:changeCardsOrder';

        // Send the data to the server
        $.post('ajax.php', newOrder);

   }

});

和HTML:

<div class="setContent>
    <div class="cardSmall" id="card_5">
        <div class="hanzi">??</div>
        <div class="meaning">Russia</div>
    </div>
    <div class="cardSmall" id="card_4">
        <div class="hanzi">??</div>
        <div class="meaning">Korea</div>
    </div>
    <div class="cardSmall" id="card_6">
        <div class="hanzi">??</div>
        <div class="meaning">China</div>
    </div>
    <div class="cardSmall" id="card_12">
        <div class="hanzi">??</div>
        <div class="meaning">Japan</div>
    </div>
    <div class="cardSmall" id="card_13">
        <div class="hanzi">??</div>
        <div class="meaning">Germany</div>
    </div>
    <div class="cardSmall" id="card_17">
        <div class="hanzi">??</div>
        <div class="meaning">Brasil</div>
    </div>
    <div class="cardSmall" id="card_14">
        <div class="hanzi">??</div>
        <div class="meaning">France</div>
    </div>
    <div class="cardSmall" id="card_19">
        <div class="hanzi">??</div>
        <div class="meaning">America</div>
    </div>
    <div class="cardSmall" id="card_16">
        <div class="hanzi">??</div>
        <div class="meaning">England</div>
    </div>
</div>

因此,在这种情况下,列表中有九个项目.但该sortable方法只返回有关八的信息.

那么我该如何解决这个问题呢？

Answer 1

你可能想要这个update活动,而不是change活动.

change每当DOM中项目的排序发生变化时,即使用户没有放弃他们正在移动的项目,也会在排序期间触发.用户更改可排序元素的顺序后update触发.