Forum einträge auflisten

[lska]

Ich würde gerne wissen wie man

1. Mit Klick auf einen Html-Link eine Tabelle sortiert nach einer Bestimmten Spalte (Datum, Id, Alphabetisch nach Name) ausgibt. Auch wenn möglich ohne neu zu laden (dann mit JS???)

2. Dass man, wenn man sich "mehr" Einträge anzeigen lassen will, nicht die komplette Seite neu geladen wird, sondern einfach nach unten erweitert wird

Danke im Voraus

[1UnitedPower]

Meine Herren!

1. Mit Klick auf einen Html-Link eine Tabelle sortiert nach einer Bestimmten Spalte (Datum, Id, Alphabetisch nach Name) ausgibt. Auch wenn möglich ohne neu zu laden (dann mit JS???)

Der Link ist dann ja keine Link mehr, er führt den Benutzer nirgendwo hin, sondern führt eine eine andere Aktion ist, deshalb benutzt man für solche Zwecke besser Buttons (einen Button kannst du so stylen, dass er trotzdem wie ein Link aussieht, wenn du das möchtest).

Und ja, sowas würde man mit JavaScript umsetzen. Dafür registriert meinen EventHandler am click-Event des Buttons. Ein EventHandler ist eine Funktion die ausgeführt wird, wenn ein bestimmtes Ereignis eintritt, in diesem Fall der Klick.
Diese Funktion muss also die Sortier-Logik implementieren.

Der Handler könnte dann folgende Schritte machen:
1. Hole alle Zeilen (tr-Elemente) aus der Tabelle.
2. Wandle die NodeListe in ein Array um.
3. Sortiere das Array wie gewünscht:
   3.1 Man kann Arrays mit myArray.sort( vergleichsFunktion ); sortieren
   3.2 Die Vergleichsfunktion müssen wir selber schreiben.
       3.2.1 Die Vergleichsfunktion bekommt zwei Array-Elemente übergeben und entscheidet, welches davon zuerst aufgereiht wird. In unserem Fall sind das also zwei tr-Elemente. Wir hangeln uns an den tr-Elementen bis zur interessanten Spalte (td-Element) entlang holen uns deren Inhalt und vergleichen nun diesen Inhalt (zum Beispiel alphabetisch oder numerisch) und liefern dem entsprechenen einen Wert kleiner 1, 0 oder größer 1 zurück. kleiner 1 bedeutet, dass erste übergebene Array-Element "kleiner" ist als das zweite.
4. Wir entfernen die tr-Elemente aus der Tabelle (removeChild).
5. Nun hängen wir die tr-Elemente in der Reihenfolge wieder ein, in der sie in unserem Array auftauchen (appendChild).

[JürgenB]

Hallo lska,

Ich würde gerne wissen wie man

1. Mit Klick auf einen Html-Link eine Tabelle sortiert nach einer Bestimmten Spalte (Datum, Id, Alphabetisch nach Name) ausgibt. Auch wenn möglich ohne neu zu laden (dann mit JS???)

z.B. so.

Gruß, Jürgen