jQuery ordinabile ottenere 2 elementi da scambiare

Question

Non riesco a trovare come ottenere l'elemento di destinazione con l'interfaccia utente jQuery ordinabile.

$("#pages").sortable({ 
     opacity: 0.6, 
     update: function(event, ui) { 
      var first = ui.item; // First element to swap 
      var second = ???? // Second element to swap 
      swapOnServer(first, second); 
     } 
    }); 

Tutte le opzioni che ho punto all'elemento provato trascinati, ma non quello che viene scambiato con: ui.item[0], event.srcElement, event.toElement.

Inoltre, this punti all'elemento LISTA (OL).

Dire secondo voglio dire seguendo:

ordine originale è:

| 0 | | 2 | |

trasciniamo elemento 1 e rilasciarlo in posizione 3. che finirà con:

| 0 | | 2 | |

Quindi il primo elemento è 1 e il secondo è 3 (ERRATO! Vedere di seguito).

AGGIORNAMENTO: Mi sono reso conto di aver sbagliato. Il nuovo ordine in questo caso sarà.

| 0 | 2 | 3 | |

Di conseguenza la mia domanda non ha davvero senso. Grazie a tutti per l'aiuto. Contrassegnerò il voto e segnerò una risposta.

Quindi la domanda è come ottenere il secondo elemento qui?

---

La soluzione CORRENTE (in quanto non v'è alcun termine come scambiando in ordinabile) è al di sotto. Usa array temporaneo con ordini.

var prevPagesOrder = []; 
    $("#pages").sortable({ 
     start: function(event, ui) { 
      prevPagesOrder = $(this).sortable('toArray'); 
     }, 
     update: function(event, ui) { 
      var currentOrder = $(this).sortable('toArray'); 
      var first = ui.item[0].id; 
      var second = currentOrder[prevPagesOrder.indexOf(first)]; 
      swapOnServer(first, second); 
     } 
    }); 

Grazie,
Dmitriy.

Answer 1

Non c'è davvero un "secondo" articolo di per sé. Hai un oggetto e lo stai semplicemente posizionando in un'altra posizione.Gli oggetti attorno ad esso regolano di conseguenza le loro posizioni. Se si desidera ottenere una matrice di tutti gli elementi, è possibile utilizzare il metodo toArray.

Answer 2

Provare a utilizzare la funzione serialize che fornisce un hash dell'elenco di elementi nell'ordine.

Se avete solo bisogno la voce che il nuovo elemento go caduto prima di poter fare questo:

$("#pages").sortable({ 
    opacity: 0.6, 
    update: function(event, ui) { 
     var first = ui.item; // First element to swap 
     var second = ui.item.prev(); 
     swapOnServer(first, second); 
    } 
}); 

secondo sarà nullo se la sua all'inizio della lista.

Answer 3

un'occhiata al "scambiabile" plugin jQuery:

http://plugins.jquery.com/project/Swapable

E 'simile a "ordinabili", ma solo due elementi del gruppo selezionato sono colpiti: elemento trascinati uno che vengono scambiati . Tutti gli altri elementi rimangono nelle loro posizioni attuali. Questo plugin è basato sul plugin jQuery esistente "Sortable" ed eredita tutte le opzioni ordinabili.

Answer 4

È possibile utilizzare http://plugins.jquery.com/project/Swapable

, ma questo non è troppo buono plug

Answer 5

È possibile utilizzare draggable e droppable invece di sortable per raggiungere swappable effetto. In pratica, questo sarà simile a questa:

(function() { 
    var droppableParent; 

    $('ul .element').draggable({ 
     revert: 'invalid', 
     revertDuration: 200, 
     start: function() { 
      droppableParent = $(this).parent(); 

      $(this).addClass('being-dragged'); 
     }, 
     stop: function() { 
      $(this).removeClass('being-dragged'); 
     } 
    }); 

    $('ul li').droppable({ 
     hoverClass: 'drop-hover', 
     drop: function (event, ui) { 
      var draggable = $(ui.draggable[0]), 
       draggableOffset = draggable.offset(), 
       container = $(event.target), 
       containerOffset = container.offset(); 

      $('.element', event.target).appendTo(droppableParent).css({opacity: 0}).animate({opacity: 1}, 200); 

      draggable.appendTo(container).css({left: draggableOffset.left - containerOffset.left, top: draggableOffset.top - containerOffset.top}).animate({left: 0, top: 0}, 200); 
     } 
    }); 
}()); 

Demo, http://jsfiddle.net/FZ42C/1/.