ASP.NET控件之RadioButtonList详解

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

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

  命名空间:System.Web.UI.WebControls

  程序集:System.Web(在 system.web.dll 中)

  [ValidationPropertyAttribute("SelectedItem")]

  public class RadioButtonList : ListControl, IRepeatInfoUser, INamingContainer, IPostBackDataHandler

  RadioButtonList 控件为网页开发人员提供了一组单选按钮,这些按钮可以通过数据绑定动态生成。该控件包含一个 Items 集合,集合中的成员与列表中的各项相对应。若要确定选择了哪一项,请测试列表的 SelectedItem 属性。

  可以用 RepeatLayout 和 RepeatDirection 属性指定如何呈现列表。如果将 RepeatLayout 设置为 RepeatLayout.Table(默认设置),列表将呈现在表中。如果设置为 RepeatLayout.Flow,列表将不以表格形式呈现。默认情况下,RepeatDirection 设置为 RepeatDirection.Vertical。将该属性设置为 RepeatDirection.Horizontal 时,列表将水平呈现。

  RadioButtonList用法:

  

  1.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("是否为中长期合同为必填项!");

  return false;

  }

  2.RadioButtonList样式调整

  .rblStyle{width:100%;height:auto;}

  .rblStyle input{border-style:none;}

  3.onselectedindexchanged事件

  像下拉控件dropdownlist控件一样,它也有onselectedindexchanged事件,当选项改变后进行触发

  注意点是:控件中的AutoPostBack属性一定设为"True",这样服务器端才知道你的选项改变了,并触发相应事件

  4.为ListItem添加提示

  RadioButtonList1.Items[0].Attributes.Add("title", "提示内容");

  5.绑定数据源

  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.改变选中项的前景色

  

  启用

  禁用

  

  

  后台:

  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.后台动态增加RadioButtonList

  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是TableRow的一个单元格TableCell

  for (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.前台改变选中项的背景色

  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 = "";

  }

  }

  }

  为大家附3个精彩的专题:

  ASP.NET控件使用手册

  ASP.NET数据绑定控件使用汇总

  ASP.NET控件使用汇总

  以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

  您可能感兴趣的文章: