Suchbox in jQuery Select2 ausblenden und eigenes Bild für die Optionen

Select2 ist ein jQuery Plugin zur Erweiterung der Funktion von HTML <select> Eingabefeldern. Es ermöglicht z.B. die Suche in den Optionen, gewählte Optionen als Tags anzuzeigen, Daten des Select vom Server zu holen und viele mehr. Die Verwendung ist sehr einfach und auf der Website des Projektes gut dokumentiert:

https://select2.github.io/

Das Ergebnis sieht z.B. so aus:

Hier 2 Optionen, die vl. nicht gleich ersichtlich sind:

Suchbox generell ausblenden:


Bilder in den Optionen anzeigen
:

Dafür definiert man eine eigene Template-Funktion, welche den HTML-Code für den jeweiligen Select2-Eintrag liefert. Als Parameter bekommt diese Funktion den jeweiligen Option-Eintrag des ursprünglichen <SELECT> geliefert. In diesem Beispiel geben wir diesem Option-Eintrag die URL eines Bildes mit, welches dazu angezeigt werden soll.
Der HTML-Code sieht also so aus:

Und der Javscript-Code: