table sort js

Tabelle-Sort-Js.

• Beschreibung: HTML -Tabellen -Sortierbibliothek mit Sortyp -Inferenz und Browsererweiterung verfügbar. #Vanillajs

• Demo

• Dokumentation. (Arbeiten in Arbeit)

• NPM -Paket. und Jsdelivr

• Firefox- und Chrome -Browser -Erweiterungen: Tische jeder Website, die Sie besuchen, werden sortierbar!

Anweisungen installieren.

• Option 1 : Laden Sie als Skript aus einem Inhaltszustellungsnetzwerk (CDN):

 < script src = "https://cdn.jsdelivr.net/npm/table-sort-js/table-sort.min.js" > </ script >

Oder nicht überminifizierte Version (größere Größe, aber einfacher zu debuggen!):

 < script src = "https://cdn.jsdelivr.net/npm/table-sort-js/table-sort.js" > </ script >

Beispiel für die Verwendung von Tabellen-sort-js mit HTML

• Option 2: Installation von NPM:

 npm install table - sort - js 

 import tableSort from "table-sort-js/table-sort.js" ;

Beispiele zur Verwendung von Tabellen-Sort-Js mit Frontend-Frameworks wie React.js und Vue.js

Um Tabellen sortierbar zu machen:

• Fügen Sie HTML <table> Tags hinzu class="table-sort" .
• Klicken Sie auf Tabellenkopfzeile, um Spalten zu sortieren.

Klassen:

<tabelle> Klassen	Beschreibung
"Tischsort"	Machen Sie den Tisch sortierbar! (Wörter, Zahlen, Daten, Dateigrößen) ...
"Tischarrows"	Zeigen Sie aufsteigende oder absteigende Pfeile an. Unterstützt benutzerdefinierte Pfeile; Zum Beispiel: "Tabelle-Arms-⇈⇋⇊"
"No-Class-Infer" "	Schalten Sie die Inferenz für das Hinzufügen von Sortierklassen automatisch aus, z.
"Erinnere dich an Sortier"	Wenn Sie auf verschiedene Spalten klicken, erinnert sich die Originalspalte.
"Zellensort"	Sortieren Sie Zellen (TD) anstelle von Tabellenreihen (TR); Nützlich, um Tabellenzeilen mit Klassen/Attributen vorhanden zu halten.

<Th> Klassen	Beschreibung
"Datensort"	Nach Datenattributen sortieren, z. B. data-sort = "42">. Nützlich für benutzerdefinierte Sorten.
"DATES-MDY-SORT"	Sortiert die Daten im US -Stil MM/DD/JJJJS -Format;. zB (28.12.2023). Kann "/" oder "-" als Trennzeichen verwenden. Überbleibige abgeleitete "DATES-DMY-SORT" -Klasse.
"Onload-Sort"	Sortieren Sie die Spalte beim Laden der Seite. Simuliert einen Klick vom Benutzer. (kann nur die Onload für eine Spalte sortieren)
"Deaktivieren" -Sort "	Nicht zu Sortieren der Tabelle nach dieser speziellen Spalte.

<Th> Abgeleitete Klassen.	Beschreibung
"Numeric-Sort"	Sortiert Zahlen einschließlich Dezimalstellen - positiv, negativ (sowohl in minus als auch in klammerner Darstellungen).
	Unterstützt gemeinsame Währungen, z.
"DATES-DMY-SORT"	Sortiert Termine im DD/MM/JJJJ -Format. EG (18.10.1995). Kann "/" oder "-" als Trennzeichen verwenden.
"DATES-MYMD-SORT"	Sortiert die Daten im ISO 8601 YJJJ/MM/DD -Format. EG (2021/10/28). Verwenden Sie "/" oder "-" als Trennzeichen.
"Dateigröße-Sort"	Sortiert Dateigrößen (B-> TIB) verwendet das binäre Präfix. (zB 10 b, 100 kib, 1 mib); Optionaler Speicherplatz zwischen Zahl und Präfix.
"Laufzeit-Sort"	Sortiert die Laufzeit in Stunden und Sekunden, z. B. 10H 1m 20s). Nützlich zum Sortieren der GitHub -Aktionen Laufzeitspalte ...

<Th> Klassen, die Standardeinstellungen ändern.	Beschreibung
"Bestell-" -Desc "	Bestellen Sie, indem Sie beim ersten Klick absteigen. (Standard ist aeskendend)
"Alpha-Sort"	Sortieren Sie alphabetisch (Z11, Z2); Standard ist eine natürliche Art (Z2, Z11).
"Punct-Sort"	Sortierzeichen sortieren; Die Standardeinstellung ignoriert Interpunktion.

Entwicklung:

Wenn Sie einen Beitrag leisten möchten, finden Sie hier Anweisungen.