Select / unselect all checkboxes on click in Repeater using Javascript or Jquery.

Aman Sharma
Using Javascript or Jquery we can acheive this easily. This article is useful for beginners.

When we want to select all check boxes on clicking header checkbox, we have to use jQuery or Javascript to achieve the same. Please follow image to understand it better.

In this article I will explain how to check all check boxes in Repeater Control using jQuery, ASP.NET (C#).

When we click on header check box then all checkboxes will got checked and if one of the checkbox is unchecked then Header will also got unchecked. If we check all checkboxes then Header checkbox will got checked automatically.

Jquery  script to select/ unselect  all Items in Repeater in one go:

<script type="text/javascript">
    $(function () {
        $("#tblStudent [id*=chkHeader]").click(function () {
            if ($(this).is(":checked")) {
                $("#tblStudent [id*=chkRow]").attr("checked""checked");
            } else {
                $("#tblStudent [id*=chkRow]").removeAttr("checked");
        $("#tblStudent [id*=chkRow]").click(function () {
            if ($("#tblStudent [id*=chkRow]").length == $("#tblStudent [id*=chkRow]:checked").length) {
                $("#tblStudent [id*=chkHeader]").attr("checked""checked");
            } else {
                $("#tblStudent [id*=chkHeader]").removeAttr("checked");

Example Using Repeater Data Control:

<fieldset style="width:300px"><legend><strong>Select all Items in Repeater</strong></legend>
<asp:Repeater ID="rptStudent" runat="server">
        <table id="tblStudent" style="border:dotted 1px">
                    <th><asp:CheckBox ID="chkHeader" runat="server" /></th>
                    <th>Student Id</th>
                    <th>Student Name</th>
                <td><asp:CheckBox ID="chkRow" runat="server" /></td>
                <td><%#Eval("Age")%> </td>

 Asp.Net Code(c#):

 //create connection with database(through web config)

SqlConnection con = new SqlConnectionConfigurationManager.ConnectionStrings["con"].ConnectionString);

    protected void Page_Load(object sender, EventArgs e)
        if (!IsPostBack)
            Fill_ Repeater ();

    //Fetch data from database and bind to gridview
    public void Fill_Repeater()
        if (con.State == ConnectionState.Open)
        DataSet ds = new DataSet();
        SqlCommand cmd = new SqlCommand();
        cmd.Connection = con;
        cmd.CommandText = "Fill_Dataset";
        cmd.CommandType = CommandType.StoredProcedure;
        SqlDataAdapter dataadapater = new SqlDataAdapter();
        dataadapater.SelectCommand = cmd;
        rptStudent.DataSource = ds;

In this article we have learnt how to slect /unselect all checkboxes in one click using jQuery. If you find it useful please comment. If you have any query, please feel free to ask through comments.

Post a Comment

Post a Comment (0)

#buttons=(Accept !) #days=(20)

Our website uses cookies to enhance your experience. Learn More
Accept !