ASP.NET list controls are:
All ASP.NET list controls derive from the ListControl class. They have a few common properties:
Items can be added statically, programmatically (using Items.Add), or from a data source.
Example: A CheckBoxList with a SelectedIndexChanged event handler:
<asp:CheckBoxList ID="CheckBoxList1" AutoPostBack="True" DataValueField="ID" DataTextField="ProductName" CellPadding="3" CellSpacing="5" RepeatColumns="2" RepeatDirection="Vertical" RepeatLayout="Table" OnSelectedIndexChanged="CheckBoxList1_SelectedIndexChanged" runat="server" />
public partial class Default : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) BindList(); } protected void CheckBoxList1_SelectedIndexChanged(Object source, EventArgs e) { // Determine the checkbox list object. CheckBoxList list = source as CheckBoxList; // Display the selected item with the lowest index. if (list.SelectedIndex != -1) { Debug.WriteLine("\nSelected item: "); Debug.WriteLine(list.SelectedItem.Value); Debug.WriteLine(list.SelectedItem.Text); } // Display all selected items. Debug.WriteLine("\nSelected items:"); foreach (ListItem item in list.Items) if (item.Selected) Debug.WriteLine(item.Text); } private void BindList() { var products = new[] { new Product { ID = 100, ProductName = "Umbrella" }, new Product { ID = 101, ProductName = "Table" }, new Product { ID = 102, ProductName = "Chair" }, new Product { ID = 103, ProductName = "Lamp" }, new Product { ID = 104, ProductName = "Bookcase" }, }; CheckBoxList1.DataSource = products; CheckBoxList1.DataBind(); } public class Product { public int ID { get; set; } public string ProductName { get; set; } } }
Output:
Selected item: 101 Table Selected items: Table Lamp Bookcase
Example: A RadioButtonList populated statically:
<asp:RadioButtonList id="RadioButtonList1" AutoPostBack="True" CellPadding="3" CellSpacing="5" RepeatColumns="2" RepeatDirection="Horizontal" runat="server"> <asp:ListItem Text="AAA" Value="1" Selected = "true"/> <asp:ListItem Text="BBB" Value="2"/> <asp:ListItem Text="CCC" Value="3"/> <asp:ListItem Text="DDD" Value="4"/> <asp:ListItem Text="EEE" Value="5"/> <asp:ListItem Text="FFF" Value="6"/> </asp:RadioButtonList>
Example: A DropDownList populated statically with an item selected in code:
<asp:DropDownList ID="DropDownList1" AutoPostBack="true" Width="200" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged" runat="server"> <asp:ListItem Value="1" Text="AAA" /> <asp:ListItem Value="2" Text="BBB" /> <asp:ListItem Value="3" Text="CCC" /> <asp:ListItem Value="4" Text="DDD" /> <asp:ListItem Value="5" Text="EEE" /> </asp:DropDownList>
public partial class Default : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { // Two methods of selecting an item. // Method #1 (FindByValue) DropDownList1.SelectedIndex = DropDownList1.Items.IndexOf(DropDownList1.Items.FindByValue("3")); // Method #2 (FindByText) ListItem item = DropDownList1.Items.FindByText("CCC"); if (item != null) DropDownList1.SelectedIndex = DropDownList1.Items.IndexOf(item); } } protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e) { // SelectedValue is a string. int val = Convert.ToInt32(DropDownList1.SelectedValue); Debug.WriteLine(val); } }
Example: A DropDownList with client-side code invoked when a value in the list changes:
<script lang="javascript" type="text/javascript"> function DoSomething(ddl) { alert(ddl.value); // shows 1, 2, or 3 } </script> ... <asp:DropDownList ID="DropDownList1" Width="50" onchange="DoSomething(this)" runat="server"> <asp:ListItem Value="1" Text="A" /> <asp:ListItem Value="2" Text="B" /> <asp:ListItem Value="3" Text="C" /> </asp:DropDownList>