L'obtention de la position de l'élément dans une liste quand il est glissé/déplacé (de l'interface utilisateur.triable)

J'ai une liste triable comme celui-ci: http://jqueryui.com/demos/sortable

Est-il possible d'obtenir le début et la fin de la position de l'élément dans la liste, quand il a été déplacé? Je suis en train de parler de leur numéro de position dans la liste.

Par exemple, si je déplace l'élément 2 à la position 5 dans la liste, je voudrais attribuer ces deux nombres pour des variables.

Je suis nouveau sur jQuery - toute aide serait grandement appréciée.

C'est un grand exemple de la terrible conception d'API de jQuery UI

OriginalL'auteur Wurlitzer | 2010-03-14

  1. 32

    SOLUTION:

    $(function() {
    $('ul#sortable').sortable({
        start: function(event, ui) {
            var start_pos = ui.item.index();
            ui.item.data('start_pos', start_pos);
        },
        update: function(event, ui) {
            var start_pos = ui.item.data('start_pos');
            var end_pos = ui.item.index();
            alert(start_pos + ' - ' + end_pos);
        }
    });
});
    +1 Belle concise réponse, mais vous n'avez pas besoin de mettre la ui.item, c'est déjà un objet jQuery. Ainsi, au lieu de $(ui.item) utilisation ui.item
    ça sonne bien! 😉
    Élégant réponse! Je vous remercie beaucoup. Je suppose que l'interface utilisateur.objet du poste est ce que je cherchais, ici.
    +1, bien que vous devriez probablement utiliser ui.item.data('start_pos', start_pos); dans start et var start_pos = ui.item.data('start_pos'); dans update plutôt que de polluer le id.
    merci Alconja pour l'astuce, plus propre maintenant! 😉 +1

    OriginalL'auteur Luca Filosofi

  2. 1

    Je crois que ce que vous cherchez à faire est fait avec le méthode serialize. Sérialiser est d'obtenir le nouvel ordre de la liste.

    OriginalL'auteur SgtOJ

  3. 1

    Pour quelque raison ui.item.index() ne fonctionne pas pour moi.

    Ce n':

    update: function (event, ui) 
{
    var index = $('li', $(ui.item).parent()).index(ui.item);
    alert(index);
}

    OriginalL'auteur Mark Kitz