English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

Spiegazione dettagliata del controllo RadioButtonList in ASP.NET

“RadioButtonList”控件表示一个封装了一组单选按钮控件的列表控件。 

可以使用两种类型的 ASP.NET 控件将单选按钮添加到网页上:各个“RadioButton”控件或一个“RadioButtonList”控件。这两类控件都允许用户从一小组互相排斥的预定义选项中进行选择。使用这些控件,可定义任意数目的带标签的单选按钮,并将它们水平或垂直排列。 

命名空间:System.Web.UI.WebControls
Assembly:System.Web (in system.web.dll) 

[ValidationPropertyAttribute("SelectedItem")]
public class RadioButtonList : ListControl, IRepeatInfoUser, INamingContainer, IPostBackDataHandler
Controllo RadioButtonListFornisce un insieme di pulsanti di opzione per gli sviluppatori web, che possono essere generati dinamicamente tramite binding dei dati. Il controllo contiene una raccolta Items, i cui membri corrispondono agli elementi dell'elenco. Per determinare quale voce è stata selezionata, testare l'attributo SelectedItem dell'elenco. 

Puoi specificare come visualizzare l'elenco utilizzando le proprietà RepeatLayout e RepeatDirection. Se imposti RepeatLayout su RepeatLayout.Table (impostazione predefinita), l'elenco verrà visualizzato in una tabella. Se impostato su RepeatLayout.Flow, l'elenco non verrà visualizzato in forma tabellare. Di default, RepeatDirection è impostato su RepeatDirection.Vertical. Quando imposti questa proprietà su RepeatDirection.Horizontal, l'elenco verrà visualizzato orizzontalmente. 

Uso di RadioButtonList:

                <div class="rblStyle">
                <asp:RadioButtonList ID="rblChangQHT" runat="server" RepeatDirection="Horizontal">
                <asp:ListItem Text="Sì" Value="1"></asp:ListItem>
                <asp:ListItem Text="No" Value="0"></asp:ListItem>
                </asp:RadioButtonList></div> 

1. Verifica del RadioButtonList

  var rb_ChangQHT = document.getElementById("rblChangQHT");
  var ShiF = rb_ChangQHT.getElementsByTagName("INPUT");
  var result = false;
  for (var i = 0; i < ShiF.length; i++) {
  if (ShiF[i].checked) {}}
   result = true;
   break;
  {}
  {}
  if (!result) {
  alert("Il campo per il contratto a lungo termine è obbligatorio!");
  return false;
  {}

2. Modifica lo stile del RadioButtonList 

.rblStyle{width:100%;height:auto;}
.rblStyle input{border-style:none;} 

3. Evento onselectedindexchanged 

Come il controllo dropdownlist, ha anche l'evento onselectedindexchanged, che viene attivato dopo che l'opzione cambia 

Attenzione: l'attributo AutoPostBack del controllo deve essere impostato su "True", in modo che il server sappia che hai cambiato l'opzione e attivi l'evento corrispondente

4. Aggiungi un suggerimento al ListItem

RadioButtonList1.Items[0].Attributes.Add("title", "Contenuto di suggerimento");

5. Bind il sorgente dei dati            

string sql = "select * from province";
DataTable dt = SQLHelper.ExecuteDataTable(sql);
this.RadioButtonList1.DataSource = dt;
this.RadioButtonList1.DataTextField = "Provinces";
this.RadioButtonList1.DataValueField = "PId";
this.RadioButtonList1.DataBind();

6. Modifica il colore di primo piano dell'elemento selezionato

<asp:RadioButtonList ID="rblIsLock" runat="server" AutoPostBack="true" OnSelectedIndexChanged="rblIsLock_SelectedIndexChanged" RepeatDirection="Horizontal" RepeatLayout="Flow">   
<asp:ListItem Selected="True" Value="0">Abilitato</asp:ListItem>   
<asp:ListItem Value="1">Disabilitato</asp:ListItem> 
</asp:RadioButtonList> 
<label>* Gli utenti disabilitati non potranno accedere</label>

Back-end:   

protected void rblIsLock_SelectedIndexChanged(object sender, EventArgs e) 
{}} 
 var rbl = sender as RadioButtonList; 
 HighliehgSelectedItem(rbl); 
{}
private void HighliehgSelectedItem(RadioButtonList rbl) 
{}} 
 foreach (ListItem li in rbl.Items) 
 {}}  
 if (li.Selected)  
 {}}  
 li.Attributes.Add("style", "color: red;");  
 {} 
 {} 
{}

7. Aggiunta dinamica di RadioButtonList in background   

 RadioButtonList rbl = new RadioButtonList();
   rbl.ID = "rbl" + (i + 1).ToString();
   rbl.BorderStyle = BorderStyle.None;
   rbl.RepeatLayout = RepeatLayout.Flow;
   rbl.RepeatDirection = RepeatDirection.Horizontal;
   rbl.TextAlign = TextAlign.Right;
   rbl.CellSpacing = 6;
   rbl.Attributes.Add("onclick", "CheckRbl('ctl00_ctl00_ctl00_ContentPlaceHolder1_cphBody_cphLower_" + rbl.ID + "')");
   rbl.DataSource = dtRating.DefaultView;
   rbl.DataTextField = "LevelID";
   rbl.DataValueField = "LevelID";
   rbl.DataBind();
   tc.Controls.Add(rbl); //tc è una cella di TableRow, TableCell
   per (int k = 0; k < rbl.Items.Count; k++)
   {}}
   rbl.Items[k].Attributes.Add("title", dtRating.Rows[k][1].ToString());
   rbl.Items[k].Attributes.Add("style", "margin-left:10px;");
   {}

8. Cambiare il colore di sfondo della selezione front-end 

  window.onload = function () {
  var arr = document.getElementsByTagName("INPUT");
  for (var i = 0; i < arr.length; i++) {
  if (arr[i].checked) {
   if (arr[i].type == "radio") {
   arr[i].style.backgroundColor = "red";
   {}
   else {
   arr[i].style.backgroundColor = "";
   {}
  {}
  else {
   arr[i].style.backgroundColor = "";
  {}
  {}
 {}

Abbiamo allegato 3 argomenti speciali interessanti:

Manuale di uso dei controlli ASP.NET

Riassunto dell'uso dei controlli di binding dei dati ASP.NET

Riassunto dell'uso dei controlli ASP.NET

Questo è tutto il contenuto dell'articolo, speriamo che sia utile per la tua apprendimento e che tu sostenga fortemente la guida urla.

Dichiarazione: il contenuto di questo articolo è stato raccolto da Internet, il copyright spetta ai rispettivi autori, il contenuto è stato contribuito e caricato autonomamente dagli utenti di Internet, questo sito non detiene i diritti di proprietà, non è stato editato manualmente e non assume responsabilità legali correlate. Se trovi contenuti sospetti di violazione del copyright, ti preghiamo di inviare una e-mail a: notice#oldtoolbag.com (al momento dell'invio dell'e-mail, sostituisci # con @) per segnalare il problema e fornire prove pertinenti. Una volta verificata, questo sito eliminerà immediatamente il contenuto sospetto di violazione del copyright.

Ti potrebbe interessare