Rubaxa Ordinabile come ottenere una serie di elementi

Question

So che questo sarà ovvio, ma non riesco a capirlo.

Im utilizzando Rubaxa/ordinabile e vorrei aggiornare il mio DB con Ajax quando un elemento viene aggiunto, rimosso o elenco è ordinato.

var editableList = Sortable.create(document.getElementById('editable'), { 
    animation: 150, 
    filter: '.js-remove', 
    onFilter: function (evt) { 
     evt.item.parentNode.removeChild(evt.item); 
    }, 
    onSort: function(evt) { 
     console.log(editableList.toArray()); // not working 

    } 
}); 

document.getElementById('addUser').onclick = function() { 
    Ply.dialog('prompt', { 
     title: 'Add', 
     form: { name: 'name' } 
    }).done(function (ui) { 
     var el = document.createElement('li'); 
     el.innerHTML = ui.data.name + '<i class="js-remove">✖</i>'; 
     editableList.el.appendChild(el); 
    }); 
}; 

Qualsiasi aiuto è apprezzato.

Answer 1

ho risolto in questo modo:

HTML:

<ul id="products"> 
    <li data-key="1"></li> 
    <li data-key="2"></li> 
    <li data-key="3"></li> 
</ul> 

JS:

var element = $('#products')[0]; 
var sortable = new Sortable(element, { 
    handle: '.drag-handle', 
    ghostClass: 'drag-ghost', 
    onSort: function (e) { 
     var items = e.to.children; 
     var result = []; 
     for (var i = 0; i < items.length; i++) { 
      result.push($(items[i]).data('key')); 
     } 
     console.log(result); 
     /* Do ajax call here */ 
    } 
}); 

Dopo la cernita si otterrà la matrice delle chiavi articoli:

[2, 3, 1]