CheckBoxList ASP.NET Server Control

CheckBoxList ASP.NET Server Control"-->

only for RuBoard

CheckBoxList ASP.NET Server Control

The CheckBoxList server control differs from the previous CheckBox control in that, when the CheckBox control is used, a single Checkbox control is rendered. On the other hand a single CheckBoxList control can render multiple check boxes. The CheckBoxList is another one of the controls that is part of the List controls suite.

The CheckBox control does give you greater flexibility in positioning than a CheckBoxList does because it renders as a list. However, the CheckBox 's data binding support is limited when compared to the CheckBoxList because it fully supports data binding using its DataSource , DataTextField , and DataValueField properties.

The CheckBoxList does give you some control over how its list is created by exposing some style attributes. You'll notice that these style attributes are also found in the DataList control. The following list contains a description of each:

  • RepeatColumns The number of columns to display ”if set to three, CheckBox es will render three across

  • RepeatDirection Controls which direction items from the data source are rendered ”values can be Horizontal or Vertical

  • RepeatLayout Determines whether the list is rendered within a TABLE or SPAN ”values can be Table or Flow

If RepeatLayout is set to Table , then two other attributes become available:

  • CellPadding The CellPadding for the container Table

  • CellSpacing The CellSpacing for the container Table

Listing 8.18 demonstrates how to bind the CheckBoxList to a data source and what attributes you can use to affect the way the control is rendered.

Listing 8.18 Using the CheckBoxList Control
 [VisualBasic.NET] 01: <%@ Import Namespace="System.Data" %> 02: <%@ Import Namespace="System.Data.SqlClient" %> 03: <script runat="server" language="vb" > 04: 05:  public sub Page_Load(sender as Object, e as EventArgs) 06: 07:   if (not IsPostBack) then 08:    cbl_DataBind() 09:   end if 10: 11:  end sub 12: 13:  public sub cbl_DataBind() 14: 15:   dim SqlCon as new SqlConnection("server=localhost; uid=sa;pwd=;database=northwind") 16:   dim SqlCmd as new SqlCommand("SELECT TOP 21 ProductName, ProductID FROM Products", graphics/ccc.gif SqlCon) 17: 18:   SqlCon.Open() 19:   cbl.DataSource = SqlCmd.ExecuteReader(CommandBehavior.CloseConnection) 20:   cbl.DataTextField = "ProductName" 21:   cbl.DataValueField = "ProductID" 22:   cbl.DataBind() 23: 24:  end sub 25: 26:  </script> [C#.NET] 01: <%@ Import Namespace="System.Data" %> 02: <%@ Import Namespace="System.Data.SqlClient" %> 03: <script runat="server" language="C#" > 04: 05:  void Page_Load(Object sender, EventArgs e) { 06: 07:   if (! IsPostBack) { 08:    cbl_DataBind(); 09:   } 10: 11:  } 12: 13:  void cbl_DataBind(){ 14: 15:   SqlConnection SqlCon = new SqlConnection("server=localhost; graphics/ccc.gif uid=sa;pwd=;database=northwind"); 16:   SqlCommand SqlCmd = new SqlCommand("SELECT TOP 21 ProductName, ProductID FROM graphics/ccc.gif Products", SqlCon); 17: 18:   SqlCon.Open(); 19:   cbl.DataSource = SqlCmd.ExecuteReader(CommandBehavior.CloseConnection); 20:   cbl.DataTextField = "ProductName"; 21:   cbl.DataValueField = "ProductID"; 22:   cbl.DataBind(); 23: 24:  } 25: 26:  </script> [VisualBasic.NET & C#.NET] 27: <html> 28:   <body> 29:    <form runat="server"> 30: 31:     <asp:Label 32:      width="100%" 33:      runat="server" 34:      text="<center>Pick Products</center>" 35:      BackColor="white" 36:      ForeColor="Navy" 37:      Font-Bold="true" 38:      Font-Size="13" 39:     /> 40: 41:     <asp:CheckBoxList 42:      runat="server" 43:      id="cbl" 44: 45:      CellPadding="4" 46:      CellSpacing="0" 47: 48:      RepeatLayout="table" 49:      RepeatColumns="3" 50:      RepeatDirection="Vertical" 51: 52:      font-size="10" 53:      BackColor="white" 54:      ForeColor="Navy" 55:      Font-Bold="true" 56:      width="100%" 57:      BorderWidth="1" 58:      BorderColor="Navy" 59:     /> 60: 61:    </form> 62:   </body> 63:  </html> 

Listing 8.18 renders the page illustrated in Figure 8.9.

Figure 8.9. The rendered CheckBoxList control.
graphics/08fig09.gif

In this example I have RepeatLayout set to Table (line 48) so each CheckBox is in its own TableCell. RepeatColumns is set to 3 (line 49) so the control is rendered three columns wide. RepeatDirection is set to Vertical , so items are ordered from the top to the bottom from the data source. I suggest playing around with the different values you can use for these three attributes so you can see the effects of each value. For instance, change RepeatLayout to Flow and leave all the other attributes the same.

Raising and Handling Events and Determining Item Selection

In this section, we'll demonstrate how to respond and handle events with the CheckBoxList control. Because the way you raise and handle events with the CheckBoxList is identical to that of the other List controls, we won't go into great detail explaining it. Listing 8.19 contains example code illustrating how to determine item selection on a post back.

Listing 8.19 Handling Events and Determining Item Selection
 [VisualBasic.NET] 01: <%@ Import Namespace="System.Data" %> 02: <%@ Import Namespace="System.Data.SqlClient" %> 03: <script runat="server" language="vb" > 04: 05:  public sub Page_Load(sender as Object, e as EventArgs) 06: 07:   if (not IsPostBack) then 08:    cbl_DataBind() 09:   end if 10: 11:  end sub 12: 13:  public sub cbl_DataBind() 14: 15:   dim SqlCon as new SqlConnection("server=localhost; uid=sa;pwd=;database=northwind") 16:   dim SqlCmd as new SqlCommand("SELECT TOP 21 ProductName, ProductID FROM Products", graphics/ccc.gif SqlCon) 17: 18:   SqlCon.Open() 19:   cbl.DataSource = SqlCmd.ExecuteReader(CommandBehavior.CloseConnection) 20:   cbl.DataTextField = "ProductName" 21:   cbl.DataValueField = "ProductID" 22:   cbl.DataBind() 23: 24:  end sub 25: 26:  public sub CheckBoxList_SelectedIndexChanged( sender as Object, e as EventArgs) 27: 28:   dim sb as new StringBuilder("<b><u>Items Selected</u></b><p>") 29: 30:   dim i as integer 31:   for i = 0 to cbl.Items.Count - 1 32: 33:    if(cbl.Items(i).Selected) then 34: 35:     sb.Append(i) 36:     sb.Append(" - ") 37:     sb.Append(cbl.Items(i).Text) 38:     sb.Append("<br>") 39: 40:    end if 41: 42:   next 43: 44:  lCheckBoxList.Text = sb.ToString() 45: 46:  end sub 47: 48: </script> [C#.NET] 01: <%@ Import Namespace="System.Data" %> 02: <%@ Import Namespace="System.Data.SqlClient" %> 03: <script runat="server" language="C#" > 04: 05:  void Page_Load(Object sender, EventArgs e) { 06: 07:   if (! IsPostBack) { 08:    cbl_DataBind(); 09:   } 10: 11:  } 12: 13:  void cbl_DataBind(){ 14: 15:   SqlConnection SqlCon = new SqlConnection("server=localhost; graphics/ccc.gif uid=sa;pwd=;database=northwind"); 16:   SqlCommand SqlCmd = new SqlCommand("SELECT TOP 21 ProductName, ProductID FROM graphics/ccc.gif Products", SqlCon); 17: 18:   SqlCon.Open(); 19:   cbl.DataSource = SqlCmd.ExecuteReader(CommandBehavior.CloseConnection); 20:   cbl.DataTextField = "ProductName"; 21:   cbl.DataValueField = "ProductID"; 22:   cbl.DataBind(); 23: 24:  } 25: 26:  void CheckBoxList_SelectedIndexChanged(Object sender, EventArgs e) { 27: 28:   StringBuilder sb = new StringBuilder("<b><u>Items Selected</u></b><p>"); 29: 30:   int i; 31:   for(i = 0; i<cbl.Items.Count; i++){ 32: 33:    if(cbl.Items[i].Selected) { 34: 35:     sb.Append(i); 36:     sb.Append(" - "); 37:     sb.Append(cbl.Items[i].Text); 38:     sb.Append("<br>"); 39: 40:    } 41: 42:   } 43: 44:   lCheckBoxList.Text = sb.ToString(); 45: 46:  } 47: 48: </script> [VisualBasic.NET & C#.NET] 49: <html> 50:  <body> 51:   <form runat="server"> 52: 53:     <asp:Label 54:      width="100%" 55:      runat="server" 56:      text="<center>Pick Products</center>" 57:      BackColor="white" 58:      ForeColor="Navy" 59:      Font-Bold="true" 60:      Font-Size="13" 61:     /> 62: 63:     <asp:CheckBoxList 64:      runat="server" 65:      id="cbl" 66: 67:      CellPadding="4" 68:      CellSpacing="0" 69: 70:      RepeatLayout="table" 71:      RepeatColumns="3" 72:      RepeatDirection="Vertical" 73: 74:      AutoPostBack="true" 75:      OnSelectedIndexChanged="CheckBoxList_SelectedIndexChanged" 76: 77:      font-size="10" 78:      BackColor="white" 79:      ForeColor="Navy" 80:      Font-Bold="true" 81:      width="100%" 82:      BorderWidth="1" 83:      BorderColor="Navy" 84:     /> 85: 86:     <p> 87: 88:     <asp:label 89:      runat="server" 90:      id="lCheckBoxList" 91:      Font-Bold="false" 92:      Font-Size="8" 93:      ForeColor="Navy" 94:      /> 95: 96: </form> 97: </body> 98: </html> 

When Listing 8.19 is executed and a check box is selected, the resulting page is posted back, and the Label control under the CheckBoxList control is populated with the names of the products next to all selected check boxes. Figure 8.10 shows a page with a few check boxes selected.

Figure 8.10. The Label control under the CheckBoxList control lists all currently selected items.
graphics/08fig10.gif
only for RuBoard


Programming Data-Driven Web Applications with ASP. NET
Programming Data-Driven Web Applications with ASP.NET
ISBN: 0672321068
EAN: 2147483647
Year: 2000
Pages: 170

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net