/ / jQuery Interfejs użytkownika do sortowania i przeciągania. Uzyskiwanie indeksu przeciąganego elementu - jquery, jquery-ui, jquery-ui-sortable, jquery-ui-draggable

Interfejs jQuery można sortować i przeciągać. Pobieranie indeksu przeciągniętego elementu - jquery, jquery-ui, jquery-ui-sortable, jquery-ui-draggable

Mam bardzo specyficzny problem, używając jQueryInterfejs użytkownika do sortowania i przeciągania razem. Chcę mieć możliwość uzyskania indeksu / umiejscowienia na liście nowo przeciąganego elementu. Jestem w stanie to uzyskać, jeśli przesunę elementy na liście.

$("#draggable").draggable({
cursor: "move",
helper: "clone",
connectToSortable: ".sortable"
});
$( ".sortable" ).sortable({
items: "li",
stop: function(event, ui) {
index = ui.item.index()+1;
console.lo(index);
},
connectWith: ".sortableSub",
appendTo: "body",
}).disableSelection();

Powyższy kod działa tak, jak powinien, ale jeśli zrobię to samo z przeciągniętym elementem.

receive: function(event, ui) {
console.log(ui.item.index());
},

użycie ui.item.index po prostu zwraca 0, jeśli zrobię to samo w stop: zamiast odbierać: zwraca -1 zamiast tego, i nie ma znaczenia, gdzie zostanie upuszczone.

Odpowiedzi:

3 dla odpowiedzi № 1

oto rozwiązanie, jak uzyskać indeks pozycji DODANO na liście sortowalnej.

receive: function( event, ui ) {
var newIndex = $(this).data("ui-sortable").currentItem.index()
}

1 dla odpowiedzi nr 2

Spróbuj tego:

$("#draggable").draggable({
cursor: "move",
helper: "clone",
connectToSortable: ".sortable"
});
$( ".sortable" ).sortable({
items: "li",
stop: function(event, ui) {
index = ui.item.index()+1;
console.log(index);
},
connectWith: ".sortableSub",
appendTo: "body",
}).disableSelection();

$( "#draggable" ).on( "dragcreate", function( event, ui ) {

console.log(ui.item.index());
});

lub spróbuj tego:

$("#draggable").draggable({
cursor: "move",
helper: "clone",
connectToSortable: ".sortable",
create: function( event, ui ) {
var index = ui.item.index()+1;
console.log(index);
}
});
$( ".sortable" ).sortable({
items: "li",
stop: function(event, ui) {
index = ui.item.index()+1;
console.log(index);
},
connectWith: ".sortableSub",
appendTo: "body",
}).disableSelection();