datatables - Sortierung speichern

[Bernd]

Guten Morgen,

ich verwende das datatables.net Script um meine Tabelle zu sortieren. Klappt auch wunderbar. Dazu habe ich eine Frage, ist es irgendwie möglich den Wert der Sortierung zu speichern dass ich nicht immer wieder die Sortierung festlegen muss? Auf der Seite finde ich irgendwie nichts. Vielleicht gibt es ja doch eine Möglichkeit.

$(".uebersicht").DataTable({
  "ordering": true,
  "paging": false,
  "order": [[ 0, 'asc' ]],
  "oLanguage": {
    "sSearch": "Suche:",
    "sZeroRecords": "Keine Einträge gefunden"
  }
});

[Gunnar Bittersmann]

@@Bernd

ich verwende das datatables.net Script um meine Tabelle zu sortieren. Klappt auch wunderbar.

Du verwendest aber nicht dasselbe kaputte Markup wie im dortigen Beispiel? Damit klappt das jedenfalls nicht. click-Event auf th-Elemente registriert, ohne dass da irgendein interaktives Element (button) wäre 😱 – mal wieder ein Musterbeispiel dafür, dass viele JavaScript-Programmierer von Frontent-Entwicklung keinen blassen Schimmer haben.

LLAP 🖖

[Rolf B]

Hallo Gunnar,

zumindest haben sie sich Mühe gegeben, die th Elemente zur Interaktivität zu vergewaltigen, es sind etliche aria-Attribute vorhanden und eine Tastaturbedienung ist auch möglich.

Rolf

[Bernd]

Hallo,

ich komme mit der TAB-Taste von Spalte zu Spalte und dann mit ENTER die Sortierung auslösen also kein Grund zum meckern? Passt alles?

[Gunnar Bittersmann]

@@Bernd

ich komme mit der TAB-Taste von Spalte zu Spalte und dann mit ENTER die Sortierung auslösen also kein Grund zum meckern? Passt alles?

Nö, beim Drücken der Leertaste springt man irgendwohin. Drücken der Leertaste ist aber genau das, wo ich erwarte, dass die Funktion ausgelöst wird, weil das die Standardbedienung eines Buttons ist.

Die Entwickler wollten vielleicht etwas Gutes tun, haben aber nicht die dafür notwendigen Kenntnisse.

LLAP 🖖

[Gunnar Bittersmann]

@@Rolf B

zumindest haben sie sich Mühe gegeben, die th Elemente zur Interaktivität zu vergewaltigen, es sind etliche aria-Attribute vorhanden

Verletzung der ersten Direktive: Verwende nicht ARIA, wenn es HTML-Elemente für diesen Zweck gibt.

und eine Tastaturbedienung ist auch möglich.

Aber nicht die standardmäßige, die ich erwarte: Bedienung per Leertaste.

LLAP 🖖

[Bernd]

Hallo,

selbstverständlich verwende ich genau dieses Beispiel wie du in meinem Code siehst. Ich habe von dem Script keine Ahnung also muss ich mich darauf verlassen? Und zur Info, es tut genau das was es soll, nämlich sortieren ohne dass die Seite neu geladen werden muss.

[Gunnar Bittersmann]

@@Bernd

selbstverständlich verwende ich genau dieses Beispiel wie du in meinem Code siehst. Ich habe von dem Script keine Ahnung also muss ich mich darauf verlassen?

Ja, genau das ist der Punkt. Anwender haben oftmals keine Ahnung und müssen sich darauf verlassen, was sie von Entwicklern so geboten kriegen. Und eben deshalb müssen Entwickler Ahnung davon haben, was sie da eigentlich tun. Die Entwickler dieses Dingens haben keine Ahnung, was sie da gebaut haben.

Vermutlich ist schon viel getan, einfach einen jeweils button in die ths zu setzen:
<th>Name</th> → <th><button>Name</button></th>.

Geht aber noch besser, dem Button eine aussagekräftige Beschriftung zu verpassen. Siehe sortierbare Taballe als Webcomponent (die Buttons werden dort mit JavaScript hinzugefügt, also das DOM ansehen, nicht den HTML-Quelltext) und @JürgenB⁠s Tutorial Tabellen dynamisch sortieren.

LLAP 🖖

[Bernd]

Ok, es gibt doch eine einfache Möglichkeit die Sortierung zu speichern:
https://datatables.net/examples/basic_init/state_save.html

Das ganze sieht dann so aus:

$(".uebersicht").DataTable({
  "ordering": true,
  "paging": false,
  "stateSave": true,
  "order": [[ 0, 'asc' ]],
  "oLanguage": {
    "sSearch": "Suche:",
    "sZeroRecords": "Keine Einträge gefunden"
  }
});

[Rolf B]

Hallo Bernd,

RTFM

• https://datatables.net/reference/event/order - Erkennen dass sortiert wurde
• https://datatables.net/reference/api/column().order() - Sortierung herstellen. Hinweise zu Multi-Column Sortierung sind dort verlinkt.

Update: Ich sehe mich durch stateSave korrigiert 😀.

Rolf

[JürgenB]

Hallo Bernd,

<werbung>Mein Tabellensortierer kann das.</werbung>

Gruß
Jürgen