Метод сериализации jQuery UI sortable исключает один элемент - PullRequest
4 голосов
/ 14 августа 2011

Я использую 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 вернет информацию только о восьми.

Screenshot of the window and with the JS console open

Так как мне это исправить?

1 Ответ

8 голосов
/ 14 августа 2011

Возможно, вы хотите событие update, а не событие change.

change запускает во время сортировки всякий раз, когда изменяется порядок элементов в DOM, даже если пользователь не отпустил перемещаемый элемент. update срабатывает после пользователь изменил порядок сортируемых элементов.

...