Datentyp

autocomplete: string
multiautocomplete: list

Beispiel

autocomplete
multiautocomplete
Hier werden Dokument-Typen vorgeschlagen, man kann z.B. "ho" (für Home) oder "re" (für Resource) ausprobieren.
Datenquelle ist eine Ajax-url, die an die Komponente übergeben wird.


Quelltext ansehen
 <script>
  $(function(){
    pluginAutocomplete('input.autocomplete',function() {
      $('input.autocomplete').autocomplete("ajaxGetObjOptions", {
        width: function() { return this.css( "width");},
        selectFirst: false
      });
      $("input.autocomplete").result(function(event, data, formatted) {
        if (data) {
          $(this).parent().next().find("input").val(data[1]);
        }
      });
    });
  });
 </script>
 <input type="text" name="autoomplete" class="autocomplete"/>


Überblick

Autocomplete-Eingabefelder erlauben es dem Benutzer noch während des Tippens schnell Werte aus sehr langen Listen auszuwählen.

Indem Text in ein Autocomplete-Feld eingegeben wird, startet das Plugin die Suche nach passenden Einträgen und zeigt eine Liste von Werten die ausgewählt werden können. Durch die Eingabe weiterer Zeichen, kann der Benutzer die Liste weiter nach besseren Treffern filtern.

Nützliche Anwendungsszenarien können z.B. die Eingabe des Namens einer Stadt und Vervollständigung der PLZ oder die Eingabe einer Email-Adresse aus einem Adressbuch sein.

Das Autocomplete-Plugin erwartet eine URL-Ressource, die einfach Textzeilen zurückliefert. Sicherheitsbeschränkungen der Browser verlangen, dass diese sich auf demselben Host befinden muss. Im Request-Parameter "q" wird die bisher erfolgte Eingabe in der URL übergeben.



Optionen

Selbst-Lernend
Wenn man die Schlüssel des Attributs frei von DTML hält, so wird das Autocomplete-Eingabefeld selbst-lernend. Neue Begriffe werden automagisch zur Schlüssel-Liste hinzugefügt. Ist diese Verhalten unerwünscht und möchte man die zur Auswahl stehenden Begriffe streng begrenzen, so kann man diese z.B. mittels <dtml-return "[list]"> zurückgeben.


Referenzen