Adding a CheckBox Column to a DataGrid






4.55/5 (25 votes)
May 30, 2003

327804

4278
Shows how to add a checkbox column to a datagrid
Introduction
A recent project I was working on required a user to select a number of options from a list. Instead of using a mulit-select list box which didn't really fit into the design of the site we decided to make a reusable control that would add a checkbox to a DataGrid
.
Using the code
To use the checkbox column in a DataGrid
it's simply a matter of registering the tag at the top of the page:
<%@ Register TagPrefix="chkbox" Namespace="DataGridControls"
Assembly="DataGridCheckbox" %>
Then to add the checkbox column to the DataGrid
:
<asp:DataGrid ID="dgTestGrid" Runat="server" AutoGenerateColumns=True
border="0" width="50%">
<Columns>
<chkbox:CheckBoxColumn/>
</Columns>
</asp:DataGrid>
The CheckBoxColumn
class is pretty straight forward:
using System;
using System.Collections;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
namespace DataGridControls
{
/// <summary>
/// CheckBoxColumn Derives from DataGrid Column
/// </summary>
public class CheckBoxColumn : DataGridColumn
{
public CheckBoxColumn(): base()
{
}
public override void InitializeCell(TableCell cell,
int columnIndex, ListItemType itemType)
{
//let the base class initialize the cell
base.InitializeCell(cell, columnIndex, itemType);
//we don't want to add a checkbox to the header.
if( itemType == ListItemType.EditItem ||
itemType == ListItemType.Item ||
itemType == ListItemType.AlternatingItem ||
itemType == ListItemType.SelectedItem){
HtmlInputCheckBox checkbox = new HtmlInputCheckBox();
//assign an ID that we can use to find the control later
checkbox.ID = "checkboxCol";
cell.Controls.Add(checkbox);
}
}
public Int32[] SelectedIndexes
{
get
{
ArrayList selectedIndexList = new ArrayList();
//iterate each DataGridItem and find our checkbox
foreach( DataGridItem item in this.Owner.Items )
{
HtmlInputCheckBox chkBox =
(HtmlInputCheckBox) item.FindControl("checkboxCol");
//If it's selected then add it to our ArrayList
if ( chkBox != null && chkBox.Checked )
{
selectedIndexList.Add( item.ItemIndex );
}
}
return (Int32[])selectedIndexList.ToArray(typeof(
System.Int32 ) );
}
}
public object[] SelectedDataKeys
{
get
{
//Just iterate each of the selectedindexes and
//match it up to the datakey field
ArrayList dataKeyList = new ArrayList();
//make sure the datakeys have some values
if(this.Owner.DataKeys.Count > 0)
{
foreach( Int32 selectedIndex in SelectedIndexes )
{
object DataKey =
(this.Owner.DataKeys[selectedIndex].ToString());
dataKeyList.Add(DataKey);
}
}
return (object[])dataKeyList.ToArray(typeof( object ) );
}
}
}
}
The class exposes 2 properties:
SelectedDataKeys:
Returns anArrayList
with theDataKey
valuesSelectedIndexes:
Returns anInt32[]
with theselectedIndex
values
To find out which checkbox has been selected:
//On our button's Onclick
protected void btnSubmit_Click(object sender, EventArgs e)
{
//Get our checkboxcolumn, we know it's position is 0
CheckBoxColumn chkbox = (CheckBoxColumn) dgTestGrid.Columns[0];
foreach(object datakeyfield in chkbox.SelectedDataKeys)
{
Response.Write(datakeyfield.ToString() + "<br>");
}
}
That's pretty much it, the DataKeyField
of the DataGrid
can be of any type. The sample I've included binds a DataTable
to the DataGrid
, you can change the DataKeyField
from "ID
" (int
) to "Name
" (string
) to see the code working with different types.