it-swarm-eu.dev

Wie gehe ich mit miteinander verbundenen Dropdown-Optionen um?

Ich habe ein Formular mit (unter anderem) 3 Dropdowns mit jeweils ca. 5-10 Auswahlmöglichkeiten. Die Auswahlmöglichkeiten in diesen Dropdowns sind eng miteinander verbunden und einige der Permutationen sind ungültig. Dies bedeutet auch, dass die aktuellen Werte in den beiden anderen ungültig sein können, wenn der Benutzer die Auswahl in einer der Dropdown-Listen ändert.

In meinem Konstruktionsdokument heißt es derzeit: "Wenn eine ungültige Kombination ausgewählt wird, sollte ein Fehler angezeigt werden" und "um dem Benutzer bei der Auswahl gültiger Kombinationen zu helfen, sollten alle Auswahlmöglichkeiten in den Dropdown-Listen, die eine ungültige Kombination erzeugen, in der Dropdown-Liste schwach beleuchtet sein ".

Ich bin nicht davon überzeugt, dass dies der beste Weg ist, damit umzugehen, aber ich kann mir keine besseren Alternativen vorstellen. Ich dachte darüber nach, sie in einem einzigen Dropdown-Menü zu kombinieren, das alle gültigen Kombinationen enthält, aber dies könnte auch unhandlich sein.

Hat jemand andere Lösungen?

8
IanR

Wenn Sie eine Reihenfolge zwischen den Dropdowns bestimmen können, ist die Lösung relativ einfach:

Jede Dropdown-Auswahl setzt die Auswahl in den folgenden (nachgeschalteten) Dropdowns zurück. Außerdem werden die verfügbaren Felder aktualisiert, um sie an die aktuelle Auswahl in dieser Dropdown-Liste anzupassen (nicht angezeigt) Optionen überhaupt).

Betrachten Sie zum Beispiel ältere Kartenseiten: Sie könnten einen Staat, dann eine Stadt und erst dann eine Straße auswählen. Es wäre durchaus akzeptabel, wenn Sie den Staat ändern würden, würden Sie die Stadt verlieren, die Sie zuvor ausgewählt haben.

Wenn es keine eindeutige Reihenfolge gibt , können Sie:

  • Die Auswahl der neuen Werte, die mit den vorhandenen Auswahlen in Konflikt stehen, ist nicht zulässig.
    Ich gehe davon aus, dass Sie diese Optionen (wie Sie sagen) in der Dropdown-Liste bereits vor der Auswahl "schwach" machen können.

  • "Low-Light" (wie Sie sagen) solche problematischen neuen Werte, aber erlauben Sie dem Benutzer, sie auszuwählen.
    Anschließend können Sie ein Dialogfeld anzeigen, in dem erläutert wird, dass der neue Wert problematisch ist.
    Der Benutzer kann wählen:

    • Schließen Sie die Warnung und überschreiben Sie sie - d. H. Die neue Option wird ausgewählt und setzt die zuvor in den anderen Dropdowns ausgewählten Kollisionswerte zurück.
    • Beachten Sie die Warnung (Schließen des Dialogs) und wählen Sie einen anderen Wert aus.
      .

    Auf jeden Fall muss der Dialog ein Kontrollkästchen "Auswahl merken" haben, damit der Benutzer beim nächsten Mal nicht gestört wird.

7
Dan Barak

Obwohl ich verstehe, dass es das Problem des Mangels an vertikalem Raum geben könnte, würde ich definitiv versuchen keine Dropdown-Listen zu verwenden, ich würde versuchen, stattdessen Elemente vom Listentyp zu verwenden (wählen Sie mehrere oder Funkeingangsgruppen aus ) - Auf diese Weise kann der Benutzer die Änderungen sehen, während er etwas in einer Gruppe auswählt, das sich auf die Optionen in anderen Gruppen auswirkt.

Außerdem würde ich zumindest versuchen, entweder a) eine Verknüpfung zu den meisten gängigen Auswahlsätzen bereitzustellen, b) zu versuchen, das Ganze neu zu konstruieren. Diese Schnittstelle kann nicht als "einfach" bezeichnet werden, wie reibungslos Sie es auch tun können :)

2
Jüri

So oft gesehen, und obwohl es offensichtlich ist, ungültige Kombinationen zu "verbieten", hat es einige Nachteile:

  1. Der Übergang zu einer gültigen Kombination kann schwierig sein, da alle Zwischenschritte nicht zulässig sind. z.B. Wenn Sie die Auswahlmöglichkeiten A/B und C/D haben und A nur mit C und B mit D zulässig ist, kann der Benutzer nicht von A + C zu B + D wechseln, da keine der Dropdown-Listen zur anderen Option wechselt. Dies kann ein besonderes Problem bei komplizierteren Systemen sein, und wenn der Benutzer nicht genau weiß, welche Kombinationen möglicherweise nicht zulässig sind. Das Finden legaler Zwischenschritte kann auf Versuch und Irrtum hinauslaufen.
  2. Der Grund für die Ablehnung kann unklar sein, und Sie möchten den Benutzer über den Grund informieren, aus dem seine Auswahl ungültig ist.

Was ich vorschlagen würde, ist, ungültige Entscheidungen nicht zu verbieten. Ihre Spezifikation sagt nicht, dass sie nicht erlaubt sein sollten; Lowlighting ist nicht dasselbe. Unterscheiden Sie die illegalen Entscheidungen von den legalen, indem Sie die Betonung aufheben, aber lassen Sie sie wählen. Koppeln Sie dies mit einem Nachrichtenbereich, der angezeigt wird, wenn eine unzulässige Kombination ausgewählt wird, geben Sie den Grund an und schlagen Sie eine Alternative vor (und erlauben Sie dem Benutzer nicht, mit dem nächsten Schritt fortzufahren).

All dies ist null und nichtig, wenn die Auswahl in eine Sequenz unterteilt werden kann: Dann ist es viel sinnvoller, die Auswahl nacheinander darzustellen und illegale Entscheidungen zu verbieten, wenn jede Auswahl präsentiert wird.

2
DJClayworth

Wenn einige Auswahlmöglichkeiten ungültig sind, sollten Sie sie einfach nicht anzeigen. Dies verringert die Möglichkeit, dass dem Benutzer ein Fehler angezeigt wird.

Wenn dies für eine Web-App gilt, verwenden Sie JavaScript, um ungültige Auswahlmöglichkeiten abhängig von der Auswahl zu beseitigen. Zeigen Sie nach und nach die zweite Dropdown-Liste mit den entsprechenden Optionen an, nachdem die erste Dropdown-Liste verwendet wurde. Das Gleiche gilt für den dritten. Überprüfen Sie den Server und nur wenn er nach Ihrer serverseitigen Überprüfung nicht überprüft wird, sollten Sie einen Fehler anzeigen. Nur diejenigen mit deaktiviertem JavaScript oder diejenigen, die absichtlich versuchen, Ihr Formular zu umgehen, werden den Fehler jemals sehen.

Wenn es sich um eine Desktop-App handelt, verwenden Sie dasselbe Prinzip.

1
Virtuosi Media