1. Discussion Forums
    2. .NET
    3. ASP.NET
You must Sign In to post a response.
  • Category: ASP.NET
    Points:1

    GridView with SelectAll Checkbox

    Hi All,
    I have GridView with 1 chk box row and header feild for that row is a chkbox(SelectAll).

    Now if i select the SelectAll chkbox and click delete button i want to delete all the feilds in gridview. Can anyone provide me a right way to acheive this.
  • #273251

    Points:6
    I use javascript to make all the checkbox checked...one checkbox is added in the header template and other in the item template

    here is the asp.net code

    <div>
    <asp:GridView ID="GridView1" runat="server" OnRowDataBound="GridView1_RowDataBound">
    <Columns>
    <asp:TemplateField>
    <HeaderTemplate>
    <asp:CheckBox ID="chkSelectAll" runat="server" />

    </HeaderTemplate>
    <ItemTemplate>
    <asp:CheckBox id="chkBxMail" runat="server" />

    </ItemTemplate></asp:TemplateField>
    </Columns>
    </asp:GridView>

    </div>

    in the row databound event this code is added

    protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
    if (e.Row.RowType == DataControlRowType.Header)
    {
    ((CheckBox)e.Row.FindControl("chkSelectAll")).Attributes.Add("onclick", "javascript:SelectAll('" +
    ((CheckBox)e.Row.FindControl("chkSelectAll")).ClientID + "')");
    }
    }

    the javascript code is

    function SelectAll(id)
    {
    var grid = document.getElementById("<%= GridView1.ClientID %>");
    var cell;
    if(grid.rows.length>0)
    {
    for(i = 1;i<grid.rows.length;i++)
    {
    cell = grid.rows[i].cells[0];
    for(j=0;j<cell.childNodes.length;j++)
    {
    if(cell.childNodes[j].type=="checkbox")
    {
    cell.childNodes[j].checked=document.getElementById(id).checked;
    }
    }
    }
    }
    }


    after that you should use findcontrol to find the checkboxes and should check if they are checked.

  • #273255

    Points:1
    if (e.Row.RowType == DataControlRowType.DataRow){CheckBox chkW1 = e.Row.FindControl("chkW1") as CheckBox;CheckBox chkW2 = e.Row.FindControl("chkW2") as CheckBox;CheckBox chkW3 = e.Row.FindControl("chkW3") as CheckBox;CheckBox chkW4 = e.Row.FindControl("chkW4") as CheckBox;CheckBox chkW5 = e.Row.FindControl("chkW5") as CheckBox;Label lblTotalChecks = e.Row.FindControl("lblTotalChecks") as Label;Label lblFrequency = e.Row.FindControl("lblFrequency") as Label;string validationScript = string.Format("return ValidateCheckAtRow('{0}', '{1}', '{2}', '{3}', '{4}', '{5}', '{6}');" , chkW1.ClientID , chkW2.ClientID , chkW3.ClientID , chkW4.ClientID , chkW5.ClientID , lblTotalChecks.ClientID , lblFrequency.ClientID);chkW1.Attributes.Add("onclick", validationScript);chkW2.Attributes.Add("onclick", validationScript);chkW3.Attributes.Add("onclick", validationScript);chkW4.Attributes.Add("onclick", validationScript);chkW5.Attributes.Add("onclick", validationScript);}

    Add javascript function ValidateCheckAtRow

    function ValidateCheckAtRow(w1, w2, w3, w4, w5, totalchecks, frequency){try{var chkW1 = document.getElementById(w1).checked;var chkW2 = document.getElementById(w2).checked;var chkW3 = document.getElementById(w3).checked;var chkW4 = document.getElementById(w4).checked;var chkW5 = document.getElementById(w5).checked;var lblFrequency = document.getElementById(frequency);var lblTotalChecks = document.getElementById(totalchecks);var limit = ReadSpanElementText(lblFrequency);var total = 0;if (chkW1){ total += 1;} if (chkW2){ total += 1;} if (chkW3){ total += 1;} if (chkW4){ total += 1;} if (chkW5){ total += 1;}if (total > limit){ alert('You have exceed the limit for the row!'); return false; }else{ WriteSpanElementText(lblTotalChecks, total); return true;}}catch(e){alert(e);return false;}}function ReadSpanElementText(sp){if (window.ActiveXObject){ return sp.innerText;}// code for Mozilla, Firefox, Opera, etc.else if (document.implementation && document.implementation.createDocument){ return sp.firstChild.nodeValue; }}function WriteSpanElementText(sp, val){// code for IEif (window.ActiveXObject){ sp.innerText = val;}// code for Mozilla, Firefox, Opera, etc.else if (document.implementation && document.implementation.createDocument){ sp.firstChild.nodeValue = val; }}

  • #273289

    Points:1
    Step 1: Create an .aspx page and add a GridView and a SqlDataSource control to it.
    Step 2: Configure the connection of SqlDataSource to point to the Northwind database. Create queries for the Select and Delete commands. The resultant code will look similar as given below :
    <asp:SqlDataSource ID="SqlDataSource1" Runat="server"
    SelectCommand="SELECT EmployeeID, LastName, City FROM Employees"
    DeleteCommand="DELETE FROM Employees WHERE [EmployeeID] = @EmployeeID"
    ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>" >
    <DeleteParameters>
    <asp:Parameter Name="EmployeeID" />
    </DeleteParameters>
    </asp:SqlDataSource>
    Step 3: Once the SqlDataSource has been configured, bind the gridview with this data source.
    Step 4: To create a checkbox in each row, follow these steps:
    1. Create a TemplateField inside the <Columns> to add custom content to each column.
    2. Inside the TemplateField, create an ItemTemplate with a CheckBox added to it.
    <asp:TemplateField>
    <ItemTemplate>
    <asp:CheckBox ID="chkRows" runat="server"/>
    </ItemTemplate>
    </asp:TemplateField>
    This will add a checkbox to each row in the grid.
    Step 5: Add a button control, and rename it to btnMultipleRowDelete.
    The resultant markup in the design view will look similar to the code below :
    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="EmployeeID" DataSourceID="SqlDataSource1">

    <Columns>
    <asp:TemplateField>
    <ItemTemplate>
    <asp:CheckBox ID="cbRows" runat="server"/>
    </ItemTemplate>
    </asp:TemplateField>

    <asp:BoundField DataField="EmployeeID" HeaderText="EmployeeID" InsertVisible="False" ReadOnly="True" SortExpression="EmployeeID" />
    <asp:BoundField DataField="LastName" HeaderText="LastName" SortExpression="LastName" />
    <asp:BoundField DataField="City" HeaderText="City" SortExpression="City" />
    </Columns>
    </asp:GridView>

    <asp:SqlDataSource ID="SqlDataSource1" Runat="server"
    SelectCommand="SELECT EmployeeID, LastName, City FROM Employees"
    DeleteCommand="DELETE FROM Employees WHERE [EmployeeID] = @EmployeeID"
    ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>" >
    <DeleteParameters>
    <asp:Parameter Name="EmployeeID" />
    </DeleteParameters>
    </asp:SqlDataSource>

    <asp:Button
    ID="btnMultipleRowDelete"
    OnClick="btnMultipleRowDelete_Click"
    runat="server"
    Text="Delete Rows" />

    In Code behind file (.cs) for C# and (.vb) for VB.NET, code the button click event. Our code will first loop through all the rows in the GridView. If a row is checked, the code retrieves the EmployeeID and passes the selected value to the Delete Command.
    C#


    protected void btnMultipleRowDelete_Click(object sender, EventArgs e)
    {
    // Looping through all the rows in the GridView
    foreach (GridViewRow row in GridView1.Rows)
    {
    CheckBox checkbox = (CheckBox)row.FindControl("cbRows");

    //Check if the checkbox is checked.
    //value in the HtmlInputCheckBox's Value property is set as the //value of the delete command's parameter.
    if (checkbox.Checked)
    {
    // Retreive the Employee ID
    int employeeID = Convert.ToInt32(GridView1.DataKeys[row.RowIndex].Value);
    // Pass the value of the selected Employye ID to the Delete //command.
    SqlDataSource1.DeleteParameters["EmployeeID"].DefaultValue = employeeID.ToString();
    SqlDataSource1.Delete();
    }
    }
    }

    VB.NET
    Protected Sub btnMultipleRowDelete_Click(ByVal sender As Object, ByVal e As EventArgs)

    ' Looping through all the rows in the GridView


    For Each row As GridViewRow In GridView1.Rows

    Dim checkbox As CheckBox = CType(row.FindControl("cbRows"), CheckBox)

    'Check if the checkbox is checked.

    'value in the HtmlInputCheckBox's Value property is set as the //value of the delete command's parameter.




    If checkbox.Checked Then

    ' Retreive the Employee ID

    Dim employeeID As Integer = Convert.ToInt32(GridView1.DataKeys(row.RowIndex).Value)

    ' Pass the value of the selected Employye ID to the Delete //command.

    SqlDataSource1.DeleteParameters("EmployeeID").DefaultValue = employeeID.ToString()

    SqlDataSource1.Delete()

    End If

    Next row

    End Sub

  • #273961

    Points:6
    <div>
    <asp:GridView ID="GridView1" runat="server" OnRowDataBound="GridView1_RowDataBound">
    <Columns>
    <asp:TemplateField>
    <HeaderTemplate>
    <asp:CheckBox ID="chkSelectAll" runat="server" />

    </HeaderTemplate>
    <ItemTemplate>
    <asp:CheckBox id="chkBxMail" runat="server" />

    </ItemTemplate></asp:TemplateField>
    </Columns>
    </asp:GridView>

    </div>

    in the row databound event this code is added

    protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
    if (e.Row.RowType == DataControlRowType.Header)
    {
    ((CheckBox)e.Row.FindControl("chkSelectAll")).Attributes.Add("onclick", "javascript:SelectAll('" +
    ((CheckBox)e.Row.FindControl("chkSelectAll")).ClientID + "')");
    }
    }

    the javascript code is

    function SelectAll(id)
    {
    var grid = document.getElementById("<%= GridView1.ClientID %>");
    var cell;
    if(grid.rows.length>0)
    {
    for(i = 1;i<grid.rows.length;i++)
    {
    cell = grid.rows[i].cells[0];
    for(j=0;j<cell.childNodes.length;j++)
    {
    if(cell.childNodes[j].type=="checkbox")
    {
    cell.childNodes[j].checked=document.getElementById(id).checked;
    }
    }
    }
    }
    }

  • #274702

    Points:1
    <div>
    <asp:GridView ID="GridView1" runat="server" OnRowDataBound="GridView1_RowDataBound">
    <Columns>
    <asp:TemplateField>
    <HeaderTemplate>
    <asp:CheckBox ID="chkSelectAll" runat="server" />

    </HeaderTemplate>
    <ItemTemplate>
    <asp:CheckBox id="chkBxMail" runat="server" />

    </ItemTemplate></asp:TemplateField>
    </Columns>
    </asp:GridView>

    </div>

    in the row databound event this code is added

    protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
    if (e.Row.RowType == DataControlRowType.Header)
    {
    ((CheckBox)e.Row.FindControl("chkSelectAll")).Attributes.Add("onclick", "javascript:SelectAll('" +
    ((CheckBox)e.Row.FindControl("chkSelectAll")).ClientID + "')");
    }
    }

    the javascript code is

    function SelectAll(id)
    {
    var grid = document.getElementById("<%= GridView1.ClientID %>");
    var cell;
    if(grid.rows.length>0)
    {
    for(i = 1;i<grid.rows.length;i++)
    {
    cell = grid.rows[i].cells[0];
    for(j=0;j<cell.childNodes.length;j++)
    {
    if(cell.childNodes[j].type=="checkbox")
    {
    cell.childNodes[j].checked=document.getElementById(id).checked;
    }
    }
    }
    }
    }


    • This thread is locked for new responses. Please post your comments and questions as a separate thread.
    If required, refer to the URL of this page in your new post.
    Submit New Thread
    Return to Return to Discussion Forum

    Top Contributors

    Today
      Last 7 Days

        more...

        About dotnetspider.com

        We believe in providing quality content to our readers. If you have any questions or concerns regarding any content published here, feel free to contact us using the Contact link below.

        Quick Links
        General
        Services

        Digital Marketing by SpiderWorks Technologies, Kochi - India. ©