it-swarm.com.de

So zwingen Sie einen Benutzer, durch Eingabe aus Vorschlägen auszuwählen

In Eingabefeldern mit automatischer Vervollständigung sind die Vorschläge normalerweise optional, der Benutzer kann jedoch eingeben, was er möchte.

Ich möchte erzwingen den Benutzer aus der vorgeschlagenen Liste auswählen.

Die beste Option, die ich mir vorstellen kann, ist, standardmäßig die erste Option auszuwählen (während er weiter tippen kann). Wenn keine Ergebnisse gefunden werden, löschen Sie das letzte Zeichen (rekursiv).

Ist das der richtige Weg? Gibt es einen Hinweis auf dieses Verhalten online?

5
ΞΫΛL

Können Sie dieses Steuerelement frei entwerfen? Wenn ich ein GUI-Steuerelement für diese Anforderung entwerfen würde, würde ich über zwei Möglichkeiten nachdenken.

Eine Möglichkeit wäre, ein Zeichen vollständig abzulehnen, wodurch die bisher eingegebene Eingabe kein brauchbares Präfix mehr für Übereinstimmungen darstellt. Machen Sie es wie in unmöglich zu tippen, aber mit einer Art Rückmeldung, dass der Charakter abgelehnt wird. (Im Eingabefeld passiert etwas Visuelles, und es ist ein Ton zu hören. Es darf niemals so aussehen, als ob die Benutzeroberfläche nicht mehr reagiert.)

Ein anderer Ansatz wäre, dem Benutzer die Eingabe beliebiger Eingaben zu ermöglichen (was Sie anscheinend möchten), aber Syntaxfarben anzuwenden, um das gültige Präfix von einem ungültigen Suffix zu unterscheiden. Zeichen, die nicht vollständig sind, können rot oder ähnlich gefärbt sein, und die GUI würde verhindern, dass diese Eingabe gesendet wird, während sie einen nachfolgenden Teil enthält, der als ungültiges Suffix gekennzeichnet ist.

Der Benutzer kann seinen Fehler und seine Rücktaste über den markierten Zeichen erkennen.

Zu jeder Zeit sollten die möglichen Auswahlmöglichkeiten angezeigt werden (es sei denn, es gibt zu viele. In diesem Fall möchten Sie die Liste auf sinnvolle Weise komprimieren), und es sollte dem Benutzer möglich sein, nur eine Verknüpfung zu einer der Auswahlmöglichkeiten herzustellen.

1
Kaz

Ein Kombinationsfeld (Textfeld/Dropdown) erzeugt die Erwartung, dass Benutzer eine beliebige Auswahl treffen können. Ich empfehle nicht, dieses Steuerelement zu verwenden, wenn der Benutzer keine neuen Auswahlmöglichkeiten angeben darf. Stattdessen würde ich ein normales Dropdown-Steuerelement bereitstellen, mit dem Benutzer weiterhin auswählen können, indem sie die meisten Benutzeroberflächen eingeben.

Insbesondere sollten Sie nicht stillschweigend ignorieren, was sie eingeben, auch wenn Sie sich dafür entscheiden, ihre Fähigkeit zur willkürlichen Eingabe beizubehalten. Wenn sie eine Auswahl eingeben, die nicht in der Liste verfügbar ist, müssen sie diesen Konflikt manuell lösen, anstatt das System versuchen zu lassen, eine für sie auszuwählen. Zum Beispiel wird das Ausfüllen eines Ergebnisses von Ontario in einem Feld, das es automatisch auf Oregon umschaltet (da das Formular nur für die USA bestimmt ist), weitaus mehr Probleme verursachen als es löst.

2
Myrddin Emrys

Es klingt für mich so, als wäre es in diesem Fall eher eine Dropdown-/Select-Combobox.

Sie können eine Version davon HIER im Sampler für das Vaadin-Framework ausprobieren.

1
AndroidHustle

Es hängt wirklich davon ab, wie viele Antworten oder Optionen Sie dem Benutzer geben werden. Wenn es sich um ein Feld mit Hunderten von möglichen Auswahlmöglichkeiten handelt, wäre eine Dropdown-Liste umständlich und würde für immer scrollen. Wenn Sie nur über 10-20 oder so sprechen, ist ein Dropdown-Menü durchaus akzeptabel.

Wenn Ihre Liste groß ist, möchte ich den Benutzer beginnen lassen, zu tippen, zu antworten und aus der Liste auszuwählen, die automatisch ausgefüllt wird. @AndroidHustle gab ein gutes Beispiel mit dem Vaadin-Framework.

Hier ist ein weiteres Beispiel für eine Liste, die während der Eingabe ausgefüllt wird, jedoch nur eine der zuvor festgelegten Antworten akzeptiert.

http://jqueryui.com/demos/autocomplete/

1
Stephen

Sie können dazu entweder die clientseitige oder die serverseitige Validierung verwenden. Verwenden Sie etwas Ähnliches wie das FilteringSelect-Widget von DOJO: http://dojotoolkit.org/reference-guide/1.7/dijit/form/FilteringSelect.html#dijit-form-filteringselect

Auf der Serverseite können Sie Eingaben validieren und "erfundene" Werte ablehnen. Und natürlich können Sie beides kombinieren.

Eine andere Option ist die Verwendung von reinem Combo (SELECT). Viele Browser unterstützen "typeahead" - Abfrage nach dem Wert darin. Aber viele Benutzer kennen/verwenden es nicht.

1