Erstellen von sich gegenseitig ausschließenden Kontrollkästchen (C#)

von Christian Wenz

PDF herunterladen

Wenn nur eine Option aus einer Reihe von Möglichkeiten ausgewählt werden kann, werden normalerweise Optionsfelder verwendet. Es gibt jedoch einen Nachteil: Sobald ein Optionsfeld in einer Gruppe ausgewählt ist, ist es nicht möglich, alle Optionsfelder zu deaktivieren. Kontrollkästchen können jederzeit deaktiviert werden, schließen sich jedoch nicht gegenseitig aus. Dieses Lernprogramm bietet das Beste aus beiden Ansätzen: Kontrollkästchen, die sich gegenseitig ausschließen.

Übersicht

Wenn nur eine Option aus einer Reihe von Möglichkeiten ausgewählt werden kann, werden normalerweise Optionsfelder verwendet. Es gibt jedoch einen Nachteil: Sobald ein Optionsfeld in einer Gruppe ausgewählt ist, ist es nicht möglich, alle Optionsfelder zu deaktivieren. Kontrollkästchen können jederzeit deaktiviert werden, schließen sich jedoch nicht gegenseitig aus. Dieses Lernprogramm bietet das Beste aus beiden Ansätzen: Kontrollkästchen, die sich gegenseitig ausschließen.

Schritte

Das ASP.NET AJAX Control Toolkit enthält den Extender "MutuallyExclusiveCheckBox". Auf diese Weise können Programmierer jedem Kontrollkästchen einen Gruppennamen (Key Attribut) zuweisen. Aus allen Kontrollkästchen innerhalb derselben Gruppe kann jeweils nur ein Kontrollkästchen ausgewählt werden.

Beginnen wir mit dem Einfügen von zwei Kontrollkästchen auf einer neuen ASP.NET Seite. Es kann mehr geben, aber zwei von ihnen reichen, um das Prinzip zu demonstrieren:

<asp:CheckBox ID="cbYes" runat="server" />Yes
<asp:CheckBox ID="cbNo" runat="server" />No

Für beide Kontrollkästchen muss ein MutuallyExclusiveCheckBoxExtender-Steuerelement auf der Seite platziert werden. Beide Schlüsselattribute müssen denselben Wert aufweisen, genauso wie die Wertattribute von HTML-Optionsfeldelementen identisch sein müssen, um die Gruppe anzugeben, zu der sie gehören. Die TargetControlID-Eigenschaft des Extenders verweist auf die ID des Kontrollkästchens.

<ajaxToolkit:MutuallyExclusiveCheckBoxExtender ID="mecbe1" runat="server"
 TargetControlID="cbYes" Key="YesNo" />
<ajaxToolkit:MutuallyExclusiveCheckBoxExtender ID="mecbe2" runat="server"
 TargetControlID="cbNo" Key="YesNo" />

Schließen Sie schließlich die ASP.NET AJAX ScriptManager ein, die von allen Elementen des ASP.NET AJAX Control Toolkits benötigt wird:

<asp:ScriptManager ID="asm" runat="server" />

Speichern Sie die Seite und führen Sie sie aus: Sie können beide Kontrollkästchen ankreuzen und deaktivieren, jedoch können nicht beide Kontrollkästchen gleichzeitig aktiviert sein.

Es kann jeweils nur ein Kontrollkästchen aktiviert werden (Klicken Sie hier, um das Bild in voller Größe anzuzeigen)