jQuery UI: sortierbar ( 'toArray') gibt eine leere Array

Question

Das hat mich verblüfft. Die Folge Code gibt ",,,,,,":

<script type="text/javascript">
$(function() {
    $('#listB').sortable({
        connectWith: '#listA',
        update: function(event, ui) {
            var result = $(this).sortable('toArray');
            alert(result);
            }
    });
    $('#listA').sortable({
        connectWith: '#listB'
    });
});
</script>

<div id="boxA">
    <ul id="listA" class="myList">
        <li value="1">Item A</li>
        <li value="2">Item B</li>
        <li value="3">Item C</li>
        <li value="4">Item D</li>
        <li value="5">Item E</li>
        <li value="6">Item F</li>
        <li value="7">Item G</li>
    </ul>
</div>

<div id="boxB">
    <ul id="listB" class="myList">
        <li value="1">Item A</li>
        <li value="2">Item B</li>
        <li value="3">Item C</li>
        <li value="4">Item D</li>
        <li value="5">Item E</li>
        <li value="6">Item F</li>
        <li value="7">Item G</li>
    </ul>
</div>

Warum ?! Es macht mich verrückt! Irgendwelche Vorschläge?

Answer 1

.sortable('toArray') serialisiert Elemente in Array Ids und Ihre Produkte haben keine Ids, das ist, warum Sie leere Zeichenfolgen haben.

Answer 2

Sie können festlegen, welche wie folgt holen Attribut:

var result = $(this).sortable('toArray', {attribute: 'value'});

Answer 3

Ich war auch dieses Problem mit der Ausnahme, ich habe ids auf meine Elemente, jQuery sortierbar ( ‚toArray‘) hat getroffen wurde sehr eine Fehl bei der Rückkehr die IDs, jedoch können Sie sie in Javascript verwenden diese greifen:

function getSortOrder() {
    var children = document.getElementById('sortedElement').childNodes;
    var sort = "";
    for (x in children) {
        sort = sort + children[x].id + ",";
    }
    return sort;
}

Das ist natürlich gibt die IDs in einer durch Kommas getrennte Zeichenfolge, aber Sie können das Array zurück. Ich bin sicher, es gibt einen besseren Weg, um dieses Problem zu lösen, das ist nur die Lösung, die ich gefunden.

Answer 4

Ich sehe ein paar rein Javascript Antworten. Sie arbeiten aber Vorsicht, sie können nicht die Elemente in der Reihenfolge zurück, die auf dem Bildschirm sichtbar ist. Verwenden Sie den Code unten finden jtsalva oben, die Einzelteile in der richtigen sortierten Reihenfolge zurückzukehren. Das hatte mich für eine Weile ratlos, weil ich die neue Ordnung in eine Datenbank speichern wollte, so konnte ich das Gitter neu zu laden, wo jemand aufgehört hat.

var result = $(this).sortable('toArray', {attribute: 'value'});

Answer 5

ein weiteres Attribut zu verwenden, dies zu tun:

$('#element').sortable('toArray' {attribute: 'value'})

Dadurch wird es so ist es jetzt das Attribut ‚Wert‘ aus dem Code verwendet wird.

Dokumentation auf Sortable toArray Methode

Answer 6

Wenn serialize einen leeren String zurück, stellen Sie sicher, dass das ID-Attribut einen Unterstrich enthalten. Sie müssen in der Form: "set_number" Zum Beispiel kann eine 3-Element-Liste mit dem ID-Attribute "foo_1", "foo_5", "foo_2" wird serialisiert zu "foo [] = 1 & foo [] = 5 & foo [] = 2". Sie können einen Unterstrich, Gleichheitszeichen oder Bindestrich zu trennen den Satz und Nummer verwenden. Zum Beispiel "foo = 1", "foo-1" und "foo_1" alle serialisiert zu "foo [] = 1".

jq sortierbar Referenz

Answer 7

$ ( 'sortierbar. ') Sortierbar (' toArray');. wird nur das erste Element der Klasse analysiert sortierbar . Sie können alle Elemente analysieren, indem Sie jeder :

$('.sortable').each(function(){
    result.push($(this).sortable('toArray'));
})