✔ Liste sortieren per jQuery

[Noeden]

Hallo Leute,

also mit jQuery kann man ja eine <ul> per drag&drop schön sortieren. Wie aber speicher ich das dann? Ich erzeuge diese Liste beim Seitenaufruf mit php. Soll ich dann in der Tabelle in der die Listenelemente stehen noch eine Spalte mit `reihenfolge` eintragen? Und dann nach dem sortieren per Ajax die einzelnen Listenelemente von oben nach unten abklappern und in die Datenbank so die Reihenfolge schreiben? Wenn ja, wie klapper ich die einzelnen Elemente in einer Schleife ab? Und wie ordne ich das zweifelsfrei dem richtigen Eintrag in der Tabelle zu? Den <li> eine Klasse mit der ID in der Datenbank geben? Also so:

<ul>
	<li class="id_1">Ich habe in der Tabelle die ID 1</li>
	<li class="id_5">Ich habe in der Tabelle die ID 5</li>
</ul>

Danke

 

[CPoly]

Anstatt der Klasse kannst du auch einfach ID nehmen.

<ul id="dieListe">
	<li id="id_1">Ich habe in der Tabelle die ID 1</li>
	<li id="id_5">Ich habe in der Tabelle die ID 5</li>
</ul>

Und wenn du jetzt auf speichern klickst, kannst du so an die Position kommen.

//Gibt jede ID und die Position aus.
$('#dieListe > li').each(function(i) {
    alert(this.id + "," + i);
});

Edit: Wenn du die Position eines bestimmten Eintrages suchst:

var items = $('#dieListe > li');
alert(items.index('#id_5'));

 

[Noeden]

So jetzt ne ganz beknackte Frage, warum zählt i mit?

Aber danke

 

[Zack]

Tag auch!

ich stand mal vor dem selben Problem und habe das recht einfach lösen können.

Ich nehme jetzt einfach mal an das du die Liste aus einer Datenbank herraus erzeugst. Du brauchst quasi in der Tabelle ein Position Wert, am besten einfach mit einer extra Spalte. Wenn du dann dein Select machst sortierst du dann aufsteigend nach dieser Spalte.

Die Reihnfolge wie die Liste aufgebaut ist bekommst du, da sich beim Verschieben auch die Position innerhalb der Liste ändert recht einfach herraus:

var list = [];
$('#listId').each(function(i, item){
     list.push(item.id);
});

So hast du dann eine sortierte Liste in der sich die ID's der <li> Tags nach der Reihnfolge befinden in der Sie verschoben wurden, also wie sie sich innerhalb des <ul> befinden.

mfg

Edit: t.t immer is wer schneller. Ich brauch einfach zu lange um sowas zu schreiben

 

[CPoly]

So jetzt ne ganz beknackte Frage, warum zählt i mit?

Einfache Antwort:
Weil es in der Dokumentation steht :-D http://api.jquery.com/jQuery.each/

Längere Antwort:
Weil die in Zeile 603 (jQuery 1.5.2) definierte Funktion "each" mit zählt. Die interessante Zeile

for ( var value = object[0]; i < length && callback.call( value, i, value ) !== false; value = object[++i] ) {}

Hier wird einfach über alle Objekte in dem jQuery Objekt iteriert und die callback Funktion aufgerufen. Und da steckt auch direkt noch mit drin, das man das iterieren durch zurückgeben von "false" stoppen kann.

 

[Noeden]

Wahnsinn, das was mein Papa immer über das Lesen gesagt hat stimmt wirklich, es hilft! :-D

Sorry habe jetzt nicht an eine "Funktion" der Funktion gedacht, sondern an etwas grundsätzliches von JavaScript, und da bin ich natürlich nicht draufgekommen. Danke DANKE DANKE

Natürlich auch an den lahmen Schreiberling