Mit dem RadioButton-Steuerelement und dem RadioButtonList-Steuerelement können Benutzer aus einer kleinen Menge sich gegenseitig ausschließender vordefinierter Optionen auswählen.
1. Funktion
Sie können das CheckBox-Steuerelement und das CheckBoxList-Steuerelement verwenden, um die folgenden Vorgänge auszuführen:
· Verursacht ein Seiten-Postback, wenn ein Optionsfeld ausgewählt ist.
·Erfassen Sie Benutzerinteraktionen, wenn der Benutzer ein Optionsfeld auswählt.
· Binden Sie jedes Optionsfeld an Daten in der Datenbank.
2. Hintergrund
Beim Hinzufügen von Optionsfeldern zu einer ASP.NET-Webseite können Sie zwei Webserversteuerelemente verwenden: ein einzelnes RadioButton-Steuerelement oder ein RadioButtonList-Steuerelement. Beide Steuerelemente ermöglichen dem Benutzer die Auswahl aus einer kleinen Menge sich gegenseitig ausschließender vordefinierter Optionen. Mit diesen Steuerelementen können Sie beliebig viele beschriftete Optionsfelder definieren und diese horizontal oder vertikal anordnen.
Sie können der Seite einzelne RadioButton-Steuerelemente hinzufügen und die Steuerelemente einzeln verwenden. Normalerweise werden zwei oder mehr separate Schaltflächen gruppiert.
Alternativ können Sie das RadioButtonList-Steuerelement verwenden, bei dem es sich um ein einzelnes Steuerelement handelt, das als übergeordnetes Steuerelement für eine Gruppe von Optionsfeldlistenelementen verwendet werden kann. Dieses Steuerelement ist von der Basisklasse ListControl abgeleitet und funktioniert daher sehr ähnlich wie die Webserversteuerelemente ListBox, DropDownList, BulletedList und CheckBoxList. Viele der Verfahren zur Verwendung des RadioButtonList-Steuerelements sind dieselben wie für andere Listen-Webserversteuerelemente.
Beide Steuerungsarten haben ihre eigenen Vorteile. Durch die Verwendung eines einzelnen RadioButton-Steuerelements haben Sie mehr Kontrolle über das Layout der Optionsfeldgruppe als durch die Verwendung eines RadioButtonList-Steuerelements. Beispielsweise können Sie zwischen den Optionsfeldern Text einfügen, der kein Optionsfeld ist.
Wenn Sie eine Reihe von Optionsfeldern basierend auf Daten aus einer Datenquelle erstellen möchten, ist das RadioButtonList-Steuerelement die bessere Wahl. Es ist auch etwas einfacher, Code zu schreiben, um zu überprüfen, welche Schaltfläche ausgewählt ist.
Hinweis: Sie können auch das HtmlInputRadioButton-Serversteuerelement verwenden, um Optionsfelder zu ASP.NET-Webseiten hinzuzufügen.
Wenn Sie dem Benutzer eine lange Liste mit Optionen oder eine Liste bereitstellen möchten, deren Länge sich zur Laufzeit ändern kann, verwenden Sie das Webserversteuerelement ListBox oder DropDownList.
1. Optionsfelder gruppieren
Optionsfelder werden selten einzeln verwendet, sondern sind gruppiert, um eine Reihe sich gegenseitig ausschließender Optionen bereitzustellen. Innerhalb einer Gruppe kann jeweils nur ein Optionsfeld ausgewählt werden. Sie können gruppierte Optionsfelder auf folgende Weise erstellen:
Fügen Sie zunächst ein einzelnes RadioButton-Webserversteuerelement zur Seite hinzu und weisen Sie dann alle Steuerelemente manuell einer Gruppe zu. Der Gruppenname kann beliebig sein; alle Optionsfelder mit demselben Gruppennamen werden als Teil einer einzelnen Gruppe betrachtet.
Fügen Sie der Seite ein RadioButtonList-Webserversteuerelement hinzu. Listenelemente in diesem Steuerelement werden automatisch gruppiert.
2. RadioButton- und RadioButtonList-Ereignisse
Ereignisse funktionieren zwischen einem einzelnen RadioButton-Steuerelement und einem RadioButtonList-Steuerelement unterschiedlich.
3. Einzelnes RadioButton-Steuerelement
Ein einzelnes RadioButton-Steuerelement löst das CheckedChanged-Ereignis aus, wenn der Benutzer auf das Steuerelement klickt. (Dieses Ereignis wird vom CheckBox-Steuerelement geerbt.) Standardmäßig führt dieses Ereignis nicht dazu, dass die Seite an den Server gesendet wird. Sie können das Steuerelement jedoch zwingen, sofort ein Postback durchzuführen, indem Sie die AutoPostBack-Eigenschaft auf „true“ festlegen.
Hinweis: Für die automatische Postback-Funktion muss der Browser ECMAScript (Jscript oder JavaScript) unterstützen und die Skripterstellung muss im Browser des Benutzers aktiviert sein.
Möglicherweise müssen Sie einen Ereignishandler für das CheckedChanged-Ereignis erstellen. Sie können testen, welches Optionsfeld in jedem Code ausgewählt ist, der als Teil der Seite ausgeführt wird. Normalerweise erstellen Sie einen Ereignishandler für das CheckedChanged-Ereignis nur dann, wenn Sie wissen müssen, dass sich ein Optionsfeld geändert hat, und nicht nur, um die aktuelle Auswahl zu lesen.
4. RadioButtonList-Steuerelement
Das RadioButtonList-Steuerelement löst das SelectedIndexChanged-Ereignis aus, wenn der Benutzer das ausgewählte Optionsfeld in der Liste ändert. Standardmäßig führt dieses Ereignis nicht dazu, dass die Seite an den Server gesendet wird. Sie können das Steuerelement jedoch zwingen, sofort ein Postback durchzuführen, indem Sie die AutoPostBack-Eigenschaft auf „true“ festlegen.
Hinweis: Für die automatische Postback-Funktion muss der Browser ECMAScript (Jscript oder JavaScript) unterstützen und die Skripterstellung muss im Browser des Benutzers aktiviert sein.
Wie bei einzelnen RadioButton-Steuerelementen ist es üblicher, den Status eines RadioButtonList-Steuerelements zu testen, nachdem die Seite auf andere Weise gesendet wurde.
5. RadioButton-Steuerelement-HTML-Attribute
Wenn das RadioButton-Steuerelement im Browser gerendert wird, wird es in zwei Teile geteilt: ein Eingabeelement, das das Optionsfeld darstellt, und ein separates Label-Element, das den Titel des Optionsfelds darstellt. Diese beiden Elemente werden zu einem Span-Element zusammengefasst.
Wenn Sie Stile oder Eigenschafteneinstellungen auf ein RadioButton-Steuerelement anwenden, werden diese Stile und Eigenschaften auf das äußere Span-Element angewendet. Wenn Sie beispielsweise die BackColor-Eigenschaft eines Steuerelements festlegen, gilt die Einstellung für das span-Element. Daher wirkt es sich sowohl auf die inneren Eingabe- als auch auf die Beschriftungselemente aus.
Manchmal müssen Sie möglicherweise separate Einstellungen für Optionsfelder und Beschriftungen festlegen. Das RadioButton-Steuerelement unterstützt zwei Eigenschaften, die zur Laufzeit festgelegt werden können. Mit dem InputAttributes-Attribut können Sie HTML-Attribute zum Eingabeelement hinzufügen, und mit dem LabelAttributes-Attribut können Sie HTML-Attribute zum Label-Element hinzufügen. Die festgelegten Eigenschaften werden unverändert an den Browser übergeben. Das folgende Beispiel zeigt, wie die Eigenschaften eines Eingabeelements so festgelegt werden, dass, wenn der Benutzer mit dem Mauszeiger über ein Optionsfeld zeigt, nur das Optionsfeld seine Farbe ändert und nicht die Beschriftung.
RadioButton1.InputAttributes.Add("onmouseover", "this.style.backgroundColor = 'red'");
RadioButton1.InputAttributes.Add("onmouseout", "this.style.backgroundColor = 'white'");
6. Binden Sie Daten an Steuerelemente
Sie können ein einzelnes RadioButton-Steuerelement an eine Datenquelle binden und Sie können jede Eigenschaft eines RadioButton-Steuerelements an ein beliebiges Feld der Datenquelle binden. Beispielsweise können Sie die Text-Eigenschaft des Steuerelements basierend auf Informationen in der Datenbank festlegen.
Da Optionsfelder in Gruppen verwendet werden, ist die Bindung eines einzelnen Optionsfelds an eine Datenquelle ungewöhnlich. Stattdessen ist es üblicher, das RadioButtonList-Steuerelement an eine Datenquelle zu binden. In diesem Fall generiert die Datenquelle dynamisch Optionsfelder (Listenelemente) für jeden Datensatz in der Datenquelle.
3. Vorgehensweise: Hinzufügen des RadioButton-Webserversteuerelements zu einer Web Forms-Seite
Es gibt zwei Möglichkeiten, Optionsfelder zu einer Web Forms-Seite hinzuzufügen:
·Fügen Sie ein einzelnes RadioButton-Webserversteuerelement hinzu.
·Fügen Sie ein RadioButtonList-Webserversteuerelement hinzu und fügen Sie dann ein einzelnes Listenelement zum Steuerelement hinzu.
Wenn Sie ein einzelnes RadioButton-Webserversteuerelement verwenden, fügen Sie der Seite normalerweise eine Reihe solcher Steuerelemente hinzu und gruppieren sie dann. Es können mehrere verschiedene Tastengruppen erstellt werden.
Schritt:
1. Ziehen Sie aus der Registerkarte „Standard“ der Toolbox das RadioButton-Steuerelement auf die Seite.
2. Geben Sie im Fenster „Eigenschaften“ den Titel an, indem Sie die Eigenschaft „Text“ festlegen.
3. Sie können die Richtung des Titels auch ändern, indem Sie die TextAlign-Eigenschaft festlegen.
4. Wiederholen Sie die Schritte 1 bis 3 für jedes Optionsfeld, das Sie der Seite hinzufügen möchten.
Gruppieren Sie einzelne RadioButton-Webserversteuerelemente
Legen Sie die GroupName-Eigenschaft jedes Steuerelements auf denselben Namen fest. Sie können eine beliebige Zeichenfolge als Namen verwenden, diese darf jedoch keine Leerzeichen enthalten. Beispielsweise können Sie der GroupName-Eigenschaft aller Schaltflächen die Zeichenfolge „RadioButtonGroup1“ zuweisen.
Um mehrere Gruppen von Schaltflächen zu erstellen, verwenden Sie für jede Gruppe einen anderen Gruppennamen.
Hinweis: Sie können der Seite jederzeit RadioButton-Steuerelemente hinzufügen und diese in vorhandene Gruppen unterteilen.
4. Vorgehensweise: Hinzufügen des RadioButtonList-Webserversteuerelements zu einer Web Forms-Seite
Es gibt zwei Möglichkeiten, Optionsfelder zu einer Web Forms-Seite hinzuzufügen:
·Fügen Sie ein RadioButtonList-Webserversteuerelement hinzu und fügen Sie dann ein einzelnes Listenelement zum Steuerelement hinzu.
·Fügen Sie ein einzelnes RadioButton-Webserversteuerelement hinzu.
Wenn Sie das RadioButtonList-Steuerelement verwenden, können Sie der Seite einzelne Steuerelemente hinzufügen. Das Hinzufügen von Elementen zu einem Steuerelement ist ein separater Vorgang, je nachdem, ob Sie eine statische Liste im Steuerelement oder eine dynamisch generierte Liste zur Laufzeit anzeigen möchten.
Schritt:
1. Ziehen Sie aus der Registerkarte „Standard“ der Toolbox das RadioButtonList-Steuerelement auf die Seite.
2. Sie können die Richtung des Titels auch ändern, indem Sie die TextAlign-Eigenschaft im Fenster „Eigenschaften“ festlegen.
3. Sie können auch das Layout des Steuerelements ändern, um mehrere Spalten anzuzeigen.
4. Befolgen Sie eine der folgenden Methoden, um ein Element für das Steuerelement zu erstellen:
·Erstellen Sie jedes Element separat.
·Binden Sie Daten an die Steuerung.
5. Vorgehensweise: Festlegen und Abrufen der Auswahl im RadioButton-Webserversteuerelement
Sie können das ausgewählte Optionsfeld zur Entwurfszeit oder zur Laufzeit im Code festlegen. Wenn ein Optionsfeld zu einer Gruppe gehört, werden durch das Setzen der Schaltfläche alle anderen Auswahlmöglichkeiten in der Gruppe gelöscht.
Hinweis: Wenn Sie das RadioButtonList-Steuerelement verwenden, ist der Vorgang zum Abrufen und Festlegen des Schaltflächenwerts anders.
1. Legen Sie das ausgewählte RadioButton-Steuerelement fest
Setzen Sie die Checked-Eigenschaft des Steuerelements auf true. Wenn Sie mehrere RadioButton-Steuerelemente in einer Gruppe auswählen, bestimmt der Browser, welche Schaltfläche ausgewählt wird.
Wenn Sie diese Eigenschaft auf „false“ setzen, wird die Auswahl gelöscht, aber kein anderes Optionsfeld ausgewählt. Daher können Sie alle Auswahlen löschen, indem Sie die Checked-Eigenschaft aller Optionsfelder in einer Gruppe auf „False“ setzen.
Das Ermitteln, welches RadioButton-Steuerelement ausgewählt wurde, ist im Wesentlichen das Testen der Checked-Eigenschaft.
public void Button1_Click (Objektsender, System.EventArgs e)
{
if (RadioButton1.Checked) {
Label1.Text = „Sie haben ausgewählt“ + RadioButton1.Text;
}
else if (RadioButton2.Checked) {
Label1.Text = „Sie haben ausgewählt“ + RadioButton2.Text;
}
else if (RadioButton3.Checked) {
Label1.Text = „Sie haben ausgewählt“ + RadioButton3.Text;
}
}
6. Vorgehensweise: Legen Sie das Layout im RadioButtonList-Webserversteuerelement fest
Standardmäßig zeigt das RadioButtonList-Webserversteuerelement nur eine Liste von Schaltflächen an. Sie können jedoch eine beliebige Anzahl von Spalten angeben und innerhalb dieser Spalten auch angeben, wie Elemente sortiert werden: vertikal (Standard) oder horizontal. Ein dreispaltiges vertikales Layout sieht so aus:
A D G
B E H
C F
Eine horizontale Anordnung derselben Elemente ergibt das folgende Layout:
A B C
D E F
G H
Geben Sie die Anzahl und Sortierung der Spalten an
·Setzen Sie die RepeatColumns-Eigenschaft des RadioButtonList-Steuerelements auf die gewünschte Anzahl von Spalten.
· Verwenden Sie die RepeatDirection-Enumeration, um die RepeatDirection-Eigenschaft auf „Vertikal“ oder „Horizontal“ festzulegen, wie im folgenden Codebeispiel gezeigt.
protected void Button1_Click (Objektsender, System.EventArgs e)
{
// Fünf Optionsfelder erstellen.
string[] farben = {"Rot", "Blau", "Grün", "Gelb", "Orange"};
this.RadioButtonList1.Items.Clear();
for(int i=0;i < farben.GetLength(0);i++){
this.RadioButtonList1.Items.Add(colors[i]);
}
// Ordnen Sie die Optionsfelder horizontal an.
this.RadioButtonList1.RepeatDirection =
RepeatDirection.Horizontal;
}
7. Vorgehensweise: Reagieren Sie auf Benutzerauswahlen in der RadioButton-Webserver-Kontrollgruppe
Wenn der Benutzer ein RadioButton-Steuerelement auswählt, löst das Steuerelement ein Ereignis aus, auf das Sie reagieren können.
Beschreibung: Die vom RadioButtonList-Steuerelement ausgelösten Ereignisse unterscheiden sich von den Ereignissen, die von einem einzelnen RadioButton-Steuerelement ausgelöst werden.
Möglicherweise müssen Sie überhaupt nicht direkt auf das Auswahlereignis des RadioButton-Steuerelements reagieren. Reagieren Sie nur dann auf dieses Ereignis, wenn Sie wissen müssen, wann der Benutzer die Auswahl in der Optionsfeldgruppe geändert hat.
Wenn Sie nur wissen möchten, welches Optionsfeld ausgewählt wurde, und nicht wissen möchten, ob sich die Auswahl geändert hat, können Sie die Auswahl des Optionsfelds einfach testen, nachdem das Formular an den Server gesendet wurde.
Da jedes RadioButton-Serversteuerelement ein separates Steuerelement ist und jedes Steuerelement unabhängig voneinander Ereignisse auslösen kann, löst die Optionsfeldgruppe keine Ereignisse als Ganzes aus.
Erstellen Sie einen Ereignishandler für das CheckedChanged-Ereignis des Steuerelements.
Standardmäßig führt das CheckedChanged-Ereignis nicht sofort dazu, dass die Web Forms-Seite an den Server gesendet wird. Stattdessen wird das Ereignis beim nächsten Senden des Formulars im Servercode ausgelöst (z. B. wenn auf das Button-Webserversteuerelement geklickt wird). Damit das CheckedChanged-Ereignis eine sofortige Veröffentlichung auslöst, legen Sie die AutoPostBack-Eigenschaft des RadioButton-Steuerelements auf „true“ fest.
Hinweis: Um das RadioButton-Steuerelement bei Auswahl an den Server zu senden, muss der Browser ECMAScript (JScript, JavaScript) unterstützen und der Browser des Benutzers muss Skripting aktivieren.
Das folgende Codebeispiel zeigt, wie reagiert wird, wenn ein Benutzer ein RadioButton-Steuerelement auswählt.
public void RadioButton1_CheckedChanged (Objektsender,
System.EventArgs e)
{
Label1.Text = „Sie haben das Optionsfeld ausgewählt“ + RadioButton1.Text;