Checkbox in Datagrid

Question

1.00/5 (1 vote)

See more:

I have a slight problem here...so I have a datagrid..and the values are retrieved into this datagrid by passing a query to the database.I have a header checkbox in the datagrid to select or deselect all the rows using javascript..and for each row there is a checkbox to check the indiviual row..Now what i want to do is..when i check the checkbox of the particular row and hit submit..the selected row must be invisible..how do i do this using C#.Please help me...Below is the ASP.NET code

JavaScript

script type="text/javascript" language="javascript">
       function select_deselectAll(chkVal, idVal, AllName, ThisName) {
           var frm = document.forms[0];
           // Loop through all elements
           for (i = 0; i < frm.length; i++) {

               if (idVal.indexOf(AllName) != -1) {

                   if (chkVal == true) {
                       if (frm.elements[i].id.indexOf(ThisName) != -1) {
                           frm.elements[i].checked = true;

                       }
                   }
                   else {
                       if (frm.elements[i].type == "checkbox") {
                           if (frm.elements[i].id.indexOf(ThisName) != -1) {
                               frm.elements[i].checked = false;
                           }
                       }
                   }

               }
               else if (idVal.indexOf(ThisName) != -1) {

                   if (frm.elements[i].type == "checkbox") {
                       if (frm.elements[i].id.indexOf(AllName) != -1) {
                           frm.elements[i].checked = false; break;
                       }
                   }
               }
           }
       }

   </script>

C#

<asp:DataGrid ID="dgEmpLeaveDetails" runat="server" DataKeyField="reqID"
                       AutoGenerateColumns="False" CssClass="vutblrow" BorderWidth="1px" PagerStyle-Mode="NumericPages"
                       Width="100%" TabIndex="6" AllowSorting="false" Visible="True">
                       <pagerstyle cssclass="pgr" mode="NumericPages" height="25px" borderstyle="Solid" />
                       <alternatingitemstyle cssclass="vutblaltrow" />
                       <HeaderStyle CssClass="vutblhdr" />
                       <itemstyle cssclass="vutblitemrow" />
                       <columns>
                           <asp:TemplateColumn>
                               <HeaderStyle HorizontalAlign="Center" />
                               <HeaderTemplate>
                                   <asp:CheckBox ID="chkView" runat="server" Text="" onclick="javascript:select_deselectAll (this.checked, this.id, 'chkView', 'cbSelect');" />
                               </HeaderTemplate>
                               <itemstyle horizontalalign="Center" />
                               <itemtemplate>
                                   <asp:CheckBox ID="cbSelect" runat="server" onclick="javascript:select_deselectAll (this.checked, this.id, 'chkView', 'cbSelect');" />
                               </itemtemplate>

                           <asp:TemplateColumn HeaderText="Sl No" ItemStyle-CssClass="ing-padding_Right" HeaderStyle-BorderColor="#718bad"
                               SortExpression="SLNum">
                               <itemtemplate>
                                   <asp:Label ID="lblSLnum" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "SLNum") %>'>
                               </itemtemplate>



                           <asp:TemplateColumn HeaderText="Employee Name" ItemStyle-CssClass="ing-padding_Right"
                               HeaderStyle-BorderColor="#718bad" SortExpression="EmpName">
                               <itemtemplate>
                                   <asp:Label ID="lblEmpName" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "empName") %>'>
                               </itemtemplate>

                           <asp:TemplateColumn HeaderText="Designation" ItemStyle-CssClass="ing-padding_Right"
                               HeaderStyle-BorderColor="#718bad" SortExpression="Designation">
                               <itemtemplate>
                                   <asp:Label ID="lbldesign" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "DesigShort") %>'>
                               </itemtemplate>

                           <asp:TemplateColumn HeaderText="Date of Move" ItemStyle-CssClass="ing-padding_Right" HeaderStyle-BorderColor="#718bad"
                               SortExpression="Date of Move">
                               <itemtemplate>
                                  <asp:Label ID="lblmovedate" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "moveDate","{0:dd/MM/yyyy}") %>'>
                               </itemtemplate>

                            <asp:TemplateColumn HeaderText="Establishment to be Visited" ItemStyle-CssClass="ing-padding_Right" HeaderStyle-BorderColor="#718bad">
                               <itemtemplate>
                                  <asp:Label ID="lblestvisited" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "esttVisited") %>'>
                               </itemtemplate>

                             <asp:TemplateColumn HeaderText="Purpose of Move" ItemStyle-CssClass="ing-padding_Right" HeaderStyle-BorderColor="#718bad">
                               <itemtemplate>
                                  <asp:Label ID="lblpurposemove" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "purpose") %>'>
                               </itemtemplate>

                                  <asp:TemplateColumn HeaderText="reqID" ItemStyle-CssClass="ing-padding_Right"
                               HeaderStyle-BorderColor="#718bad" SortExpression="IsActive" Visible="false">
                               <itemtemplate>
                                   <asp:Label ID="lblreqid" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "reqID") %>'>
                               </itemtemplate>


                           <asp:TemplateColumn HeaderText="Is Active" ItemStyle-CssClass="ing-padding_Right"
                               HeaderStyle-BorderColor="#718bad" SortExpression="IsActive" Visible="false">
                               <itemtemplate>
                                   <asp:Label ID="lblIsActive" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "IsActive") %>'>
                               </itemtemplate>

                       </columns>

Posted 19-Mar-14 5:59am

Member 10066916

Updated 19-Mar-14 18:57pm

VICK

v3

Add a Solution

2 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

**VICK** · Answer 1 · 2014-03-19T19:06:00

Solution 2

To make the selected DataGrid's rows visible = false.

You can try the following code in your Submit Button click event.

C#

foreach (DataGridItem itm in YourDataGrid.Items)
      {
          CheckBox cb = (CheckBox)itm.FindControl("yourchildcheckboxID");
          if (cb.Checked)
          {
              itm.Visible = false;
          }
      }

Please Keep in mind that DataGrid's entertain the rows as Items, while GridView entertain them as Rows.

Hope it will help. :)

Posted 19-Mar-14 19:06pm

VICK

Comments

Member 10066916 20-Mar-14 2:57am

yes vick! this does work thank you very much...but when i reload my page the contents are seen again..I dont want them to be seen again..any idea how do i do this?

VICK 20-Mar-14 4:21am

So you want to permanently make some rows visible= false???

If YES!, Dn do add a column(Flag: you can name it visible and put true as default) in DB table from which you are binding the data to the Grid. and on selection inside the above code run a query to make the relative row's flag False. and than rebind the Grid with the data only having Flag= true and not false.

VICK 20-Mar-14 4:23am

Further if this helps you solve your problem! or leads you to the way of solution. DO UpVote and Accept as Solution. :)

Kishor Khatri · Answer 2 · 2014-03-19T08:24:00

I didn't get your code...
but i think if i got your question...
Here is an Example...

XML

<script type="text/javascript">
        function CheckAll(obj) {
            var list = document.getElementById("<%=DataGrid1.ClientID%>");
            var chklist = list.getElementsByTagName("input");
            for (var i = 0; i < chklist.length; i++) {
                if (chklist[i].type == "checkbox" && chklist[i] != obj) {
                    chklist[i].checked = obj.checked;
                }
            }
        }
</script>

For Header Template

ASP.NET

<HeaderTemplate>
<asp:checkbox id="CheckBox1" onclick="CheckAll(this);" runat="server" xmlns:asp="#unknown" />
</HeaderTemplate>

for Item Template