This thread is for discussions of Selecting, Confirming & Deleting Multiple Checkbox Items In A DataGrid (i.e. HotMail & Yahoo).

Really nice code!!!

This code produced following errors:

'System.Web.UI.WebControls.BoundColumn' does not have a property named 'ID'

Fixed: Deleted all 'ID=Boundcolumn1....' in the .aspx file

It didn`t find the property Address error:

Fixed: Adding 'stor_address as Address' to the sqlQuery in BindData function in .aspx.cs file

Code:

foreach (DataGridItem i in MyDataGrid.Items)
           {
               CheckBox deleteChkBxItem = (CheckBox) i.FindControl ("DeleteThis");
               if (deleteChkBxItem.Checked)
               {

are u sure that is working ? i mean it always gives un checked objects

no matter what I do the checkboxes are always unchecked. What am I missing?
looks like no data is posted, tested with a text box and the text is always empty.
The data is in the form collection but when I loop over the items and check the checkboxes for being checked, they are always unchecked.

Same here. It always returning unchecked check boxes.

I had the same problem until I checked the <FORM> tags in the aspx page.  Ensure that you only have one <FORM> tag, and that it includes the <ASP: checkbox...> tag.

I was having the no boxes checked problem -- I think it was caused by the data being bound to the datagrid on postback, thus erasing any checks that may have been entered.  (My data was getting bound during the page_load event, which happened before the button click event handler)

If you are experiencing a similar problem, make sure you loop through your datagrid before any binding occurs.

hi, and im using visual basic asp.net application to select item(s) in datagrid using checkbox and show the item selected in other datagrid on the same page, and i have a go button to transfer items... im done showing the selected items on the other grid but once i didn't check any of checkbox in datagrid i meet an error...  pls help me.. thanks a lot in advance.. hope someone post a sample code..

The code saved me finding the checkbox data grid solution on my own. Some comments after using it:
The script in "select_deselectAll" has a side effect of affecting all checkboxes and radiobuttons on the page. A check should be added to ensure that only the relevant checkboxes are touched by the function (check the "frm.elements [ i ] .id" inside the for-loop).

Checking if the "idVal" paramenter contains a static string should be moved outside the for-loop. Assign the results to two boolean vars and use the boolean vars inside the for-loop.

In the "else if" section, add a "break;" statement after the line that deselected the header checkbox (the line with "//Uncheck main select all checkbox"). It has no purpose to continue the for-loop, as the header checkbox is already deselected.

In addition, a more robust way of referencing the header checkbox than "frm.elements [ 1 ] " should be implemented, e.g. when there are other elements on the page in addition to the checkbox data grid.

Hi,,

if the header checkbox was not check then
i want to ask if the user selects all of the checkboxes then how can we write code to make the header checkbox checked

thanks

I have improved the script. So, it can now check the "main checkbox" if all the checkboxes are checked. And it decheck the "main checkbox" if any checkbox is dechecked. It works as yahoo mail.

The main point is to check all the checkbox when a checkbox's state is changed.

(chkAll is the name of the main Checkbox, chkDelete is the name of the checkbox at every row.)


<script language="JavaScript">
<!--
function confirmDelete (frm) {

// loop through all elements
for (i=0; i<frm.length; i++) {

   // Look for our checkboxes only
   if (frm.elements.name.indexOf ('chkDelete') !=-1) {
       // If any are checked then confirm alert, otherwise nothing happens
       if(frm.elements.checked) {
           return confirm ('Are you sure you want to delete your selection(s)?')
       }
   }
}
return false;
}


function select_deselectAll (chkVal, idVal) {
   var frm = document.forms[0];
   

   if (idVal.indexOf('chkDelete') != -1 && chkVal == true){
   
       var boolAllSelected = true;

       for (i=0; i<frm.length; i++) {
           if (frm.elements.id.indexOf('chkDelete') != -1 && frm.elements.checked == false){
               boolAllSelected = false;    
               break;
           }
       }
       
       if(boolAllSelected == true){
           
           for (j=0; j<frm.length; j++) {
                   if (frm.elements[j].id.indexOf ('chkAll') != -1) {
                       frm.elements[j].checked = true;
                       break;
                   }
           }
       }
       
   }
   else{
       for (i=0; i<frm.length; i++) {
           if (idVal.indexOf ('chkAll') != -1) {
               if(chkVal == true) {
                   frm.elements.checked = true;
               }
               else {
                   frm.elements.checked = false;
               }
           }
           else if (idVal.indexOf('chkDelete') != -1 && frm.elements.checked == false) {
                   for (j=0; j<frm.length; j++) {
               
                       if (frm.elements[j].id.indexOf ('chkAll') != -1) {
                           frm.elements[j].checked = false;
                           break;
                       }
                   }
               }
           }
       }
}
//-->
</script>

[3] ravindra_reddy81@yahoo.co.in [/3]
*****************************************
here is html code
******************************************
<%@ Page Language="vb" AutoEventWireup="false" Codebehind="articlellist.aspx.vb" Inherits="table.articlellist"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
   <HEAD>
       <title>WebForm1</title>
       <meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
       <meta content="Visual Basic .NET 7.1" name="CODE_LANGUAGE">
       <meta content="JavaScript" name="vs_defaultClientScript">
       <meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
       <SCRIPT language="JavaScript">
       function confirmdel(frm1)
       {        
       for (i=0; i<frm1.length; i++)
           {
           if(frm1.elements.checked == true)
               {
               var val=true;
               break;
               }
               else
               {
               val=false;
               }
           }
           if (val==true)
           {
           return confirm('Are you sure you want to Delete your selection(s)?');
           }
           else
           {
           alert('No item is selected for Delete');
           }
       }
       </SCRIPT>
       <SCRIPT language="JavaScript">
       
   function select_deselectAll (chkVal, idVal)
{
   var frm = document.forms[0];
   // Loop through all elements
   for (i=0; i<frm.length; i++)
   {
       // Look for our Header Template's Checkbox
       if (idVal.indexOf ('CheckAll') != -1)
       {
           // Check if main checkbox is checked, then select or deselect datagrid checkboxes
           if(chkVal == true)
           {
               frm.elements.checked = true;
           }
           else
           {
               frm.elements.checked = false;
           }
           // Work here with the Item Template's multiple checkboxes
       }
       else
        if (idVal.indexOf ('DeleteThis') != -1)
       {
           // Check if any of the checkboxes are not checked, and then uncheck top select all checkbox
           if(frm.elements.checked == false)
           {
               document.Form1.CheckAll.checked=false;
                //Uncheck main select all checkbox
           }            
       }
   }
}
       </SCRIPT>
   </HEAD>
   <body MS_POSITIONING="GridLayout">
       <form id="Form1" method="post" runat="server">
           <asp:label id="Label1" style="Z-INDEX: 102; LEFT: 109px; POSITION: absolute; TOP: 93px" runat="server" Width="504px"></asp:label>
           <TABLE id="Table1" style="Z-INDEX: 104; LEFT: 457px; WIDTH: 196px; POSITION: absolute; TOP: 29px; HEIGHT: 27px" cellSpacing="1" cellPadding="1" width="196" border="0">
               <TR>
                   <TD style="WIDTH: 155px"><asp:label id="Label2" runat="server" Width="137px"></asp:label></TD>
                   <td><A title="Sign Out" href="signout.aspx" runat="server">SignOut</A>
                   </td>
               </TR>
           </TABLE>
           <asp:button id="Button2" style="Z-INDEX: 103; LEFT: 123px; POSITION: absolute; TOP: 365px" runat="server" Width="45px" Text="Add" Height="20px" BorderStyle="Groove" Font-Names="Verdana" Font-Size="8pt"></asp:button><asp:datagrid id="DataGrid1" style="Z-INDEX: 101; LEFT: 159px; POSITION: absolute; TOP: 128px" runat="server" Width="446px" Height="15px" BorderStyle="Groove" Font-Names="Verdana" Font-Size="8pt" GridLines="Horizontal" ForeColor="#E0E0E0" BorderColor="Gray" BorderWidth="1px" BackColor="White" AutoGenerateColumns="False" AllowPaging="True" PageSize="7">
               <SelectedItemStyle Font-Bold="True" ForeColor="White" BackColor="#E0E0E0"></SelectedItemStyle>
               <EditItemStyle HorizontalAlign="Center" ForeColor="LightGray" BackColor="White"></EditItemStyle>
               <AlternatingItemStyle BackColor="White"></AlternatingItemStyle>
               <ItemStyle Font-Size="8pt" Font-Names="Verdana" HorizontalAlign="Center" Height="5px" ForeColor="Black" BorderStyle="Groove" BorderColor="Gray" BackColor="White"></ItemStyle>
               <HeaderStyle Font-Size="8pt" Font-Names="Verdana" HorizontalAlign="Center" Height="15px" ForeColor="Black" BorderStyle="Groove" BackColor="#E0E0E0"></HeaderStyle>
               <FooterStyle HorizontalAlign="Center" Height="24px" ForeColor="#E0E0E0" BorderStyle="Groove" BackColor="#E0E0E0"></FooterStyle>
               <Columns>
                   <asp:TemplateColumn>
                       <HeaderTemplate>
&nbs

[3]8[/3] purple [3]8[/3] [3]8[/3] [arial]ariel[/arial] b  ravindra_reddy81@yahoo.co.in
hi every body.here is my code to develop hotmail style and yahoomail style datagrid with confirm delete message.if u have any doubts send me mail i will send entire code to you.enjoy with this code.
RAVINDRAREDDY
************************ravindra_reddy81@yahoo.co.in
*****************************************************************
here is my html code
**************************************
<%@ Page Language="vb" AutoEventWireup="false" Codebehind="articlellist.aspx.vb" Inherits="table.articlellist"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
   <HEAD>
       <title>WebForm1</title>
       <meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
       <meta content="Visual Basic .NET 7.1" name="CODE_LANGUAGE">
       <meta content="JavaScript" name="vs_defaultClientScript">
       <meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
       <SCRIPT language="JavaScript">
       function confirmdel(frm1)
       {        
       for (i=0; i<frm1.length; i++)
           {
           if(frm1.elements.checked == true)
               {
               var val=true;
               break;
               }
               else
               {
               val=false;
               }
           }
           if (val==true)
           {
           return confirm('Are you sure you want to Delete your selection(s)?');
           }
           else
           {
           alert('No item is selected for Delete');
           }
       }
       </SCRIPT>
       <SCRIPT language="JavaScript">
       
   function select_deselectAll (chkVal, idVal)
{
   var frm = document.forms[0];
   // Loop through all elements
   for (i=0; i<frm.length; i++)
   {
       // Look for our Header Template's Checkbox
       if (idVal.indexOf ('CheckAll') != -1)
       {
           // Check if main checkbox is checked, then select or deselect datagrid checkboxes
           if(chkVal == true)
           {
               frm.elements.checked = true;
           }
           else
           {
               frm.elements.checked = false;
           }
           // Work here with the Item Template's multiple checkboxes
       }
       else
        if (idVal.indexOf ('DeleteThis') != -1)
       {
           // Check if any of the checkboxes are not checked, and then uncheck top select all checkbox
           if(frm.elements.checked == false)
           {
               document.Form1.CheckAll.checked=false;
                //Uncheck main select all checkbox
           }            
       }
   }
}
       </SCRIPT>    </HEAD>
   <body MS_POSITIONING="GridLayout">
       <form id="Form1" method="post" runat="server">
           <asp:label id="Label1" style="Z-INDEX: 102; LEFT: 109px; POSITION: absolute; TOP: 93px" runat="server" Width="504px"></asp:label>
           <TABLE id="Table1" style="Z-INDEX: 104; LEFT: 457px; WIDTH: 196px; POSITION: absolute; TOP: 29px; HEIGHT: 27px" cellSpacing="1" cellPadding="1" width="196" border="0">
               <TR>
                   <TD style="WIDTH: 155px"><asp:label id="Label2" runat="server" Width="137px"></asp:label></TD>
                   <td><A title="Sign Out" href="signout.aspx" runat="server">SignOut</A>
                   </td>
               </TR>
           </TABLE>
           <asp:button id="Button2" style="Z-INDEX: 103; LEFT: 123px; POSITION: absolute; TOP: 365px" runat="server" Width="45px" Text="Add" Height="20px" BorderStyle="Groove" Font-Names="Verdana" Font-Size="8pt"></asp:button><asp:datagrid id="DataGrid1" style="Z-INDEX: 101; LEFT: 159px; POSITION: absolute; TOP: 128px" runat="server" Width="446px" Height="15px" BorderStyle="Groove" Font-Names="Verdana" Font-Size="8pt" GridLines="Horizontal" ForeColor="#E0E0E0" BorderColor="Gray" BorderWidth="1px" BackColor="White" AutoGenerateColumns="False" AllowPaging="True" PageSize="7">
               <SelectedItemStyle Font-Bold="True" ForeColor="White" BackColor="#E0E0E0"></SelectedItemStyle>
               <EditItemStyle HorizontalAlign="Center" ForeColor="LightGray" BackColor="White"></EditItemStyle>
               <AlternatingItemStyle BackColor="White"></AlternatingItemStyle>
               <ItemStyle Font-Size="8pt" Font-Names="Verdana" HorizontalAlign="Center" Height="5px" ForeColor="Black" BorderStyle="Groove" BorderColor="Gray" BackColor="White"></ItemStyle>
               <HeaderStyle Font-Size="8pt" Font-Names="Verdana" HorizontalAlign="Center" Height="15px" ForeColor="Black" BorderStyle="Groove" BackColor="#E0E0E0"></HeaderStyle>
               <FooterStyle Horiz

Thanks for posting this comment meef. I could not figure out why mine was not running either till i read your comment

Hi,

I need this solution to work for a large number of items in a page view.

Using this solution (and\or other similar ones), means iterating through all the items when the user might have checked just one or two.

Is there a way to make this more efficient?

Thanks.
-Shefali