Sunday, February 8, 2009

CheckBoxList Control, Asp.net 2.0

The CheckBoxList control provides a multi selection check box group that can be dynamically generated with data binding. It contains an items collection with members corresponding to individual items in the list. To determine which items are checked, iterate through the collection and test the Selected property of each item in the list. Let us start how you can use the checkboxlist control in your code and which are the important properties which you need to remember when using the checkBoxList control. Here are the important properties of the CheckBoxList control
Property
Description
CellPaddingThe amount of pixels between the border and the contents of the table cell
CellSpacingGets or sets the distance (in pixels) between cells.
RepeatColumnsThe number of columns to use when displaying the check box group
RepeatDirectionSpecifies whether the check box group should be repeated horizontally or vertically
RepeatLayoutThe layout of the check box group
TextAlignOn which side of the check box the text should appear
The above table show some of the important properties regarding the layout of the checkBoxList control. When checkBoxList control is render it generate the html table and place the List item. Let us start with our example code here is the image which show the html of the checkBoxList control.
From the image you can see that i have only set the cell Padding , Cell Spacing and the repeat columns. i have set the repeat column property of the checkBoxList property to 2 as i want to display the checkboxs in two column table. Here is the output of the setting, which are shown in above image


Here is the code sample which is used to bind the checkBoxList , which is show in above image.

chkMainCategoriesList.DataSource = DataSource;
chkMainCategoriesList.DataTextField = "Text column to be displayed";
chkMainCategoriesList.DataValueField = "Value Column";
chkMainCategoriesList.DataBind();
In the code above the datasource is either datatable, table of a dataset or even the datareader object as we are binding to the the value from the database. Set the DataTextField property of the checkBoxList to display the text of the the checkbox and finally set the DataValueField property of the checkBoxList to save the id of the option which is used for further processing. And at the end call the DataBind() function of the checkboxList to bind the datasource values.
Now here is the code to get all the selected checkboxes in the checkBodList control when user select his/her options from the checkboxList. Here is the cod you can use to get the selected cehckBox fromt he checkboxlist

foreach (ListItem listItem in chkRequirements.Items)
if (listItem.Selected)
{
//place your logic here
}

Here is the image which show which property of the ListItem are available when you declare and use the listItem in foreach loop.


You can see that listItem have Selected property which is of boolean type, Text property which is displayed to user and the value property.

All and any comments / bugs / suggestions are welcomed!

3 comments:

awaisj said...

Isn't there any difference between CellSpacing and CellPadding property?

Asim said...

awaisj: That was my fault , CellSpacing is the distance between cells.

awaisj said...

:)