Tom Select – für bessere Formulare (5)

Moin!

Wolltest du schonmal ein Select-Feld mit allen etwa 200 Ländern der Welt benutzerfreundlicher gestalten?

Ich auch bisher nur ein Mal.

Aber neulich stand ich vor einer ähnlichen Herausforderung. Ich wollte eine „Autocomplete/Autosuggest“-Funktion für eine Liste von Unterseiten zu realisieren. Und da fiel mir wieder meine Lösung für die Länderauswahl von damals ein, die – würde mein Plan aufgehen – deutlich weniger Aufwand wäre, als eine vollwertige Suche zu programmieren.

Dafür habe ich im ersten Schritt einen eigenen Controller nach dem Vorbild der Contao Quicknavigation angelegt, um ein Select mit den gewünschten Unterseiten zu erzeugen. Und dann habe ich meine Wunderwaffe Tom Select (genialer Name) integriert, um die Optionen des Selects durchsuchbar zu machen.

Tom Select ist die moderne VanillaJS Variante von Chosen (was du aus dem Contao Backend kennst). Dank der Javascript API von Tom Select sind da ziemlich coole Sachen möglich (schau dir mal die Beispiele an).

Am Ende habe ich dank Tom Select eine superschnelle Suche für Unterseiten mit verhältnismäßig wenig Aufwand umsetzen können (im Vergleich zur Entwicklung einer Suche).

Aber das Ganze funktioniert natürlich auch, wenn du in einem Formular eine größere Auswahl von Optionen hast (ab 10 Optionen könnte sich eine Lösung wie Tom Select lohnen).

Kennst und nutzt du Tom Select bereits? Oder verwendest du eine Alternative? Lass es mich gerne wissen.

Erstma'
Dennis