projekte

sodInput - JavaScript

Download: Download sodInput Version 1.0
Demo: Am Ende dieser Seite

Lizenz: MIT
Benötigt: Prototype Framework 1.6+ (im Download enthalten)

Beschreibung:

Dieses JavaScript wandelt beliebige HTML <select> Tags in eine andere Art Benutzereingabefeld um. Dieses neue Feld stellt die verfügbaren Optionen in einer Liste dar, die mithilfe der Tastatur oder der Maus ausgewählt und gefiltert werden können. Jede Auswahl wird dabei als einzelner Tag innerhalb des neuen Eingabefeldes dargestellt.

Sämtliche Benutzereingaben werden auf das HTML <select> Tag übertragen, weswegen Serverseitig keine Anpassungen nötig sind.

Einbau des Skriptes in die eigene Seite:

1. Ein gewöhnliches <select> Tag - hier mit der id="multiSelect1"
   
   
   
2. Nun setzen wir das JavaScript auf das <select> Feld mit der id multiSelect1 an
   

           <script type="text/javascript">
               new sodInput("multiSelect1", {});
           </script>

3. Das <select> Feld wird versteckt, die Optionen eingelesen und das sodInput angezeigt
   
   

Demo / Beispiel direkt zum Testen:

Eintrag 1 Eintrag 2 Eintrag 3 Eintrag 4 Eintrag 5 Noch ein Eintrag Ein anderer Eintrag Option 1 Option 2 Option 3

Die Farben sind beliebig über die CSS Datei einstellbar.