jQuery to Check Uncheck Select Deselect all items in Asp.net CheckBoxList on click of Select All CheckBox

  ASP.NET Projects

Complete ASPX HTML Codes:-

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default5.aspx.cs" Inherits="Default5" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">

<script src="http://code.jquery.com/jquery-1.11.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            //Check all/UncheckAll skills if Select All is Checked/UnChecked
            $("#<%=chkSelectAll.ClientID %>").click(function () {
                $("[id*=chkSkills] input:checkbox").prop('checked', this.checked);

            $("[id*=chkSkills] input:checkbox").click(function () {
                //If Select All checkbox is checked but Skill checkbox is unchecked then uncheck
                if ($("#<%= chkSelectAll.ClientID %>").prop('checked') == true && this.checked == false) {
                    $("#<%= chkSelectAll.ClientID %>").prop('checked', false);
                else {
                    var flag = true;
                    //If any of the Skills Checkbox is unchecked then also Uncheck Select All Checkbox
                    $("[id*=chkSkills] input:checkbox").each(function () {
                        if (this.checked == false)
                            flag = false;
                    //If all of the Skills Checkbox is checked then also check Select All Checkbox
                    $("#<%= chkSelectAll.ClientID %>").prop('checked', flag);
    <form id="form1" runat="server">
    <fieldset style="width:250px;">
    <legend>Select your technical skills</legend>
      <asp:CheckBox ID="chkSelectAll" runat="server" Text="Select All" />
        <br />
        <asp:CheckBoxList ID="chkSkills" runat="server" RepeatColumns="2" RepeatDirection="Horizontal">
            <asp:ListItem Value="1">Asp.Net</asp:ListItem>
            <asp:ListItem Value="2">MVC</asp:ListItem>
            <asp:ListItem Value="3">jQuery</asp:ListItem>
            <asp:ListItem Value="4">WCF</asp:ListItem>


(Visited 14 times, 1 visits today)