suche HTML Element mit 3 Zuständen (checkbox-ähnlich)

[Linuchs]

Moin,

Gruppenmitglieder sollen angeben, ob sie an einem Termin (Auftritt) teilnehmen oder nicht.

Das wäre eine checkbox. Der dritte Zustand ist aber, dass sie noch nicht gewählt haben. Wie kann man das visualisieren?

Gruß, Linuchs

[Gunnar Bittersmann]

@@Linuchs

Gruppenmitglieder sollen angeben, ob sie an einem Termin (Auftritt) teilnehmen oder nicht.

Das wäre eine checkbox. Der dritte Zustand ist aber, dass sie noch nicht gewählt haben. Wie kann man das visualisieren?

Mit einer Grupe aus 2 Radiobuttons, keiner vorausgewählt: yepnope.

Oder so, dass man das Formular ohne Auswahl nicht absenden kann: yepnope, required.

Eine einmal getroffene Entscheidung kann dann aber nicht so einfach zurückgenommen werden.

🖖 Живіть довго і процвітайте

[Linuchs]

Hallo Gunnar,

Mit einer Gruppe aus 2 Radiobuttons, keiner vorausgewählt

Danke dir, so mache ich das.

Wenn sich jemand entschieden hat für JA, kann er es noch ändern auf NEIN, aber nicht mehr angeben, dass er keine Wahl getroffen hätte.

Gruß, Linuchs

[Der Martin]

Hallo,

Mit einer Gruppe aus 2 Radiobuttons, keiner vorausgewählt

Wenn sich jemand entschieden hat für JA, kann er es noch ändern auf NEIN, aber nicht mehr angeben, dass er keine Wahl getroffen hätte.

genau richtig erkannt.
Wenn du mit dieser kleinen Einschränkung leben kannst, ist die Lösung okay.

Einen schönen Tag noch
 Martin

[Gunnar Bittersmann]

@@Linuchs

„ja | nein“ einmalig über die Radiobuttons zu schreiben kann man machen, wenn es nicht so viele Veranstaltungen sind, dass die Beschriftung aus dem Blickfeld verschwindet, sonst sollte die Beschriftung sticky sein. Du solltest aber noch dafür sorgen, dass die „|“ bündig untereinander stehen.

Jeder Radiobutton sollte aber eine zugängliche Beschriftung haben, in der „ja“ bzw. „nein“ und der Titel der jeweiligen Veranstaltung enthalten ist. (Das Wörtchen „Teilnahme“ schadet auch nicht, damit man weiß was mit „ja“/„nein“ gemeint ist.)

Also den Elementen mit „ja“, „nein“ und den Titeln der Veranstaltungen IDs geben und diese per aria-labelledby referenzieren.

☞ Beispiel

🖖 Живіть довго і процвітайте

[Raketenwilli]

3 Radiobuttons mit gleichem Name aber unterschiedlicher ID und unterschiedlichen Werten. „Nicht gewählt“ wird mit checked markiert, so lange nichts gewählt wurde, sonst natürlich die früher gespeicherte Entscheidung.

Da kann der Benutzer seine Wahl auch „rückgängig machen“.

[MudGuard]

Hi,

Gruppenmitglieder sollen angeben, ob sie an einem Termin (Auftritt) teilnehmen oder nicht.

Das wäre eine checkbox. Der dritte Zustand ist aber, dass sie noch nicht gewählt haben. Wie kann man das visualisieren?

evtl. auch per Select-Element mit 3 Option-Kindern.

cu,
Andreas a/k/a MudGuard

[Der Martin]

Hallo,

Das wäre eine checkbox. Der dritte Zustand ist aber, dass sie noch nicht gewählt haben. Wie kann man das visualisieren?

evtl. auch per Select-Element mit 3 Option-Kindern.

oder noch mehr. Ja, Nein, Vielleicht, Mir doch egal ...

Einen schönen Tag noch
 Martin

[Gunnar Bittersmann]

@@MudGuard

evtl. auch per Select-Element mit 3 Option-Kindern.

Meh, bitte nicht. Optionen sind initial nicht ohne Interaktion ersichtlich. Zur Auswahl braucht man einen Click mehr.

Und der Platzbedarf für ja/nein(/vielleicht) ist auch nicht wesentlich größer.

Aufklapp-Auswahlmenüs (select) mögen vielleicht(!) sinnvoll sein, wenn es viele Optionen sind, die als Radiobuttongruppe das Formular wuchtig und unübersichtlich erscheinen ließen.

Ansonsten sollten Radiobuttons das Mittel der Wahl sein.

🖖 Живіть довго і процвітайте

[Felix Riesterer]

Lieber Linuchs,

ich hatte mal eine ähnliche Frage: Markup für dreistufigen Klick-Schalter - oder ist das nicht das, wonach Du suchst?

Liebe Grüße

Felix Riesterer

[JürgenB]

Hallo,

nur der Vollständigkeit halber: checkboxen kennen als dritten Zustand indeterminate, der aber nur per Javascript gesetzt werden kann.

Gruß
Jürgen