Wednesday, May 22, 2013

Gridview checkbox validation using JavaScript in


In this article i will explain check the checkbox selected status in gridview using JavaScript in

The following example check whether checkboxes selected in gridview or not. In this example I have taken one gridview with checkboxes and I have taken one button If user click on button without check any checkbox it rise validation.

Firstly I am created a database EmpDetail. and Now I am created a table in this database. 

Query Code

CREATE TABLE [dbo].[Emp_Info](
      [Emp_Id] [int] NULL,
      [Name] [varchar](50) NULL,
      [Salary] [int] NULL,
      [City] [varchar](50) NULL
Now Insert some Data in Emp_Info table. Then use the following procedure.
Complete Program


<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Checkbox_Validation.aspx.cs" Inherits="Checkbox_Validation" %>
<!DOCTYPE html>
<html xmlns="">
<head runat="server">
    <script type="text/javascript">
        function CheckBox_Validation()
            var valid = false;
            var gdvw = document.getElementById('<%= gdview.ClientID %>');
            for (var i = 1; i < gdvw.rows.length; i++)
                var value = gdvw.rows[i].getElementsByTagName('input');
                if (value != null)
                    if (value[0].type == "checkbox")
                        if (value[0].checked)
                            valid = true;
                            alert("Checkbox selected successfully");
                            return true;
            alert("Please select atleast one checkbox");
            return false;
    <form id="form1" runat="server">
    <asp:GridView ID="gdview" CssClass="Gridview" runat="server" AutoGenerateColumns="false" HeaderStyle-BackColor="#669999"
HeaderStyle-Font-Bold="true" HeaderStyle-ForeColor="Black" HeaderStyle-BorderColor="#333300" HeaderStyle-BorderWidth="1">
                    <asp:CheckBox ID="chkbox" runat="server" />         
                    <asp:CheckBox ID="chkboxchild" runat="server" />
            <asp:BoundField HeaderText="Emp_Id" DataField="Emp_Id" HeaderStyle-HorizontalAlign="Left" >
<HeaderStyle HorizontalAlign="Left"></HeaderStyle>
            <asp:BoundField HeaderText="Name" DataField="Name" HeaderStyle-HorizontalAlign="Left" >
<HeaderStyle HorizontalAlign="Left"></HeaderStyle>
            <asp:BoundField HeaderText="Salary" DataField="Salary" HeaderStyle-HorizontalAlign="Left" >
<HeaderStyle HorizontalAlign="Left"></HeaderStyle>
            <asp:BoundField HeaderText="City" DataField="City" HeaderStyle-HorizontalAlign="Left" >
<HeaderStyle HorizontalAlign="Left"></HeaderStyle>
        <EditRowStyle Font-Bold="False" Font-Italic="False" />
<HeaderStyle BackColor="#99CCFF" Font-Bold="True" ForeColor="Black" BorderColor="#663300" BorderWidth="1px"></HeaderStyle>
        <br />
        <asp:Button runat="server" Text="Submit" OnClientClick="javascript:CheckBox_Validation()" Font-Bold="True" Font-Italic="False" />


using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Data.SqlClient;
public partial class Checkbox_Validation : System.Web.UI.Page
    SqlConnection con;
    SqlDataAdapter da;
    DataSet ds;
    protected void Page_Load(object sender, EventArgs e)
        using (con = new SqlConnection("Data Source=.;Initial Catalog=EmpDetail;Integrated Security=True"))
            using (da = new SqlDataAdapter("Select * from Emp_Info", con))
                ds = new DataSet();
                gdview.DataSource = ds.Tables[0];
Output 1

Click on "Submit" button without any check checkbox

Output 2

Click on "Submit" button after check checkboxes