webentwicklung-frage-antwort-db.com.de

jQuery UI: sortable ('toArray') gibt ein leeres Array zurück

Das hat mich verblüfft. Der folgende Code gibt "," zurück:

<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?

21
bjork24

.sortable('toArray') serialisiert Elemente Ids in ein Array, und Ihre Elemente haben keine IDs. Aus diesem Grund haben Sie leere Zeichenfolgen.

38
manji

Sie können das Attribut wie folgt definieren:

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

Ich hatte auch dieses Problem, außer dass ich IDs auf meinen Elementen hatte. Die Sortierung von jQuery ('toArray') war ein großer Fehlschlag bei der Rückgabe der IDs. Sie können sie jedoch in Javascript verwenden, indem Sie Folgendes verwenden:

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

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

Ich sehe ein paar reine Javascript-Antworten. Sie funktionieren, aber passen Sie auf, dass Sie die Elemente möglicherweise nicht in der Reihenfolge zurückgeben, die auf dem Bildschirm angezeigt wird. Wenn Sie den Code unten verwenden, siehe oben, werden die Artikel in der richtigen Reihenfolge zurückgegeben. Dies hatte mich für eine Weile verblüfft, weil ich die neue Bestellung in einer Datenbank speichern wollte, um das Gitter dort aufzuladen, wo jemand aufgehört hatte.

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

$ ('. sortierbar'). sortierbar ('toArray'); parst nur das erste Element der Klasse sortable . Sie können alle Elemente analysieren, indem Sie each verwenden: 

$('.sortable').each(function(){
    result.Push($(this).sortable('toArray'));
})
0
trojan

Um ein anderes Attribut zu verwenden, können Sie Folgendes tun:

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

Dadurch wird nun das Attribut 'value' aus Ihrem Code verwendet.

Dokumentation zur Sortable toArray-Methode

0
jtsalva

Wenn serialize eine leere Zeichenfolge zurückgibt, stellen Sie sicher, dass die ID-Attribute einen Unterstrich enthalten. Sie müssen folgende Form haben: "set_number". Eine 3-Element-Liste mit den ID-Attributen "foo_1", "foo_5", "foo_2" wird zu "foo [] = 1 & foo [] = 5 & foo [] = 2" serialisiert. Sie können einen Unterstrich, ein Gleichheitszeichen oder einen Bindestrich verwenden, um Satz und Zahl voneinander zu trennen. Zum Beispiel "foo = 1", "foo-1" und "foo_1" werden alle zu "foo [] = 1" serialisiert.

jq sortierbare Referenz

0
Skeletor