Filterfunktion für Tabellen

Mit Elements können Tabellen mit Filterfunktion angelegt werden. Hierfür kann einer klassischen Tabelle die class="filtertable" zugewiesen werden.

Beispiel: Tabelle mit class=”filtertable”

Mit der class="filtertable" wird eine Filter-Möglichkeit aktiviert:

Keywords Impressions Clicks CTR Rank
silly tshirts 6,000 110 1.8% 22.2
desktop workspace photos 2,200 500 22% 8.9
arrested development quotes 13,500 900 6.7% 12.0
popular web series 8,700 350 4% 7.0
2013 webapps 9,900 460 4.6% 11.5
ring bananaphone 10,500 748 7.1% 17.3

 

Parameter für das Filtern

Eine ausführliche Liste der verfügbaren Möglichkeiten finden Sie in der Dokumention für tablesorter.

Die gängigsten Parameter finden Sie hier aufgelistet:

Priorität Typ (1) Beschreibung Beispiele
1 | oder ODER Logisches “Oder” (Vertikaler Balken). Filtern Sie die Spalte nach Inhalten, die den Text auf einer Seite
des Balkens entsprechen (2).		 box|bat (findet eine Spaltenzelle mit entweder “box” oder “bat”); Alex|Peter (Findet Text, der entweder “Alex” oder “Peter” enthält);
<20 oder >40
2 && oder UND Logisches “Und”. Filtern Sie die Spalte nach Inhalten, die den Text auf beiden Seiten des Operators
entsprechen.		 box && bat (findet eine Spaltenzelle, die sowohl “box” als auch “bat” enthält),
Br && c (Findet Text, der sowohl “br” als
auch “c” enthält), >20 && <40 oder
a und !o (Wenn “filter-match” eingestellt ist,
finden Sie Inhalte mit dem Buchstaben “a”, aber nicht dem Buchstaben “o”)
3 /\d/ Fügen Sie jedem Regex zur Abfrage hinzu, um ihn in der Abfrage zu verwenden (“mig” Flags können
eingeschlossen werden /\w/mig)		 /b[aeiou]g/i (findet “bag”, “beg”, “BIG”, “Bug”, usw);/r$/ (passt zu Text, der mit einem “r” endet)
4 < <= >= > Finden Sie alphabetische oder numerische Werte, die kleiner oder größer oder gleich der gefilterten
Abfrage sind (1).		 >= 10 (findet Werte, die größer oder gleich 10
sind)
5 ! oder != Nicht-Operator, oder nicht genau übereinstimmen. Filtern Sie die Spalte mit Inhalten, die der Abfrage
nicht entsprechen. Fügen Sie ein Gleichheitszeichen (=), ein einfaches
(') oder ein doppeltes Anführungszeichen (") hinzu, um genau nicht
einem Filter zu entsprechen (v2.17.1).		 !fe (versteckt Zeilen mit “weiblich” in dieser Spalte, zeigt aber Zeilen mit
“männlich”);!a (findet Text, der kein “a”
enthält);!"Bruce" (findet Inhalte, die nicht genau
“Bruce” entsprechen)
6 " oder = Um der Suchanfrage genau zu entsprechen, fügen Sie ein Anführungszeichen, ein Apostroph oder ein
Gleichheitszeichen am Anfang und/oder Ende der Abfrage hinzu		 abc" oder abc= (genau übereinstimmend mit “abc”);John" oder John= (genau übereinstimmend mit “John”)
7 - oder bis Finden Sie einen Bereich von Werten. Stellen Sie sicher, dass vor und nach dem Bindestrich (oder dem
Wort “bis”) ein Leerzeichen ist (3).		 10 - 30 oder 10 bis 30 (passt zu Werten zwischen 10 und 30)
8 ? Platzhalter für ein einzelnes, nicht-leerzeichen Zeichen. J?n (findet “Jan” und “Jun”, aber nicht “Joan”);a?s (findet “Dumass” und “Evans”, aber nicht “McMasters”)
8 * Platzhalter für null oder mehr nicht-leerzeichen Zeichen. B*k (passt zu “Black” und “Book”);a*s
(passt zu “Dumass”, “Evans” und “McMasters”)
9 ~Führen Sie eine unscharfe Suche durch (passt zu sequenziellen
Zeichen), indem Sie ein Tilde am Anfang der Abfrage hinzufügen (v2.13.3) 		~bee (passt zu “Bruce Lee” und “Brenda Dexter”),
oder ~piano (passt zu “Philip Aaron Wong”)
10 Text Jeder in den Filter eingegebene Text wird mit dem im Text gefundenen Text
übereinstimmen		 abc (findet “abc”, “abcd”, “abcde”, usw);Aaron (findet “Aaron” und “Philip Aaron Wong”)