Adding a CheckBox Column to a DataGrid

• Download source files - 11.9 Kb

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 an ArrayList with the DataKey values
• SelectedIndexes: Returns an Int32[] with the selectedIndex 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.

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here