Jörg: Suchhilfe bei Checkboxauswahl

Beitrag lesen

Hallo Rolf,

Die Idee ist:

  • ein Texteingabefeld (genauer input type="search")
  • eine Liste (bei mir eine Table) mit den darzustellenden Daten
  • eine Prise CSS, die dafür sorgt, das alle Einträge ausgeblendet werden, die eine bestimmte Klasse haben (z.B. "no-match"). Diese Klasse ist beim Laden der Seite nicht vorhanden, so dass initial alles angezeigt wird.
  • mit JavaScript einen input-Handler drauflegen, so dass jede Änderung zu einem Eventhandler-Aufruf führt
  • nach jeder Änderung des Feldinhaltes alle Einträge der Liste durchgehen und pro Eintrag prüfen, ob er auf die Suche passt. Wenn nicht, die Klasse "no-match" setzen
  • Wird das Eingabefeld geleert, sicherstellen, dass die Klasse überall entfernt wird

Das ist eigentlich alles. Mit etwas jQuery auch einfach gemacht.

Changehandler registrieren:

$("#suchfeld").on("input", handleSearchEntry);

Alle Listeneinträge durchlaufen

$("#liste li").each(checkMatch);

handleSearchEntry und checkMatch sind die entsprechenden Funktionen.

Ob es dafür was fertiges gibt - keine Ahnung. Der Schmalz steckt in "checkMatch", das musst Du so programmieren, dass die Suche richtig läuft und je nach Ergebnis die no-match Klasse setzen.

Klasse Idee. Würde ich mir mit etwas Unterstützung auch zutrauen, selber zu bauen. Aber durch Deine idee bin ich darauf gekommen, dass ich bereits ein fertiges Plugin nutze, dass genau das innerhalb von Tabellen macht. Wirklich 1:1 so, wie Du beschreibst, ich hatte es nur nihct mehr auf dem Schirm.

Und ich nutze es sogar innerhalb meines Systems bereits mit Checkboxen.

Das Plugin nennt sich "quicksearch" (für den Fall, dass mal irgendwer dasselbe sucht und auf diesen Forenbeitrag stößt.

Leider ist das Original schon 10-12 Jahre alt und ich finde keinen Link mehr dahin und die Forks dieses Plugins kenne ich nicht, daher kann ich es nicht verlinken. 🙁 Aber mein Original funktioniert und ich weiß, wie ichs nutzen muss. Daher schaue ich mir die Forks nicht an, aber wer interessiert ist, kann mal unter diesem Stichwort suchen.

Danke auf jeden Fall für die gute Idee, Rolf.👍

Gruß, Jörg