Part 66 Check uncheck all checkboxes with another single checkbox using jquery

Link for code samples used in the demo

Healthy diet is very important both for the body and mind. If you like Aarvi Kitchen recipes, please support by sharing, subscribing and liking our YouTube channel. Hope you can help.

Here is the requirement
1. When the checkbox in the header is selected, all the checkboxes in the respective rows should be selected. If we deselect any of the checkbox, then the header checkbox should be automatically deselected.
2. When the checkbox in the header is deselected, all the checkboxes in the respective rows should be deselected as well. If we start to select each checkbox in the datarows, and upon selecting checkboxes in all the datarows, the checkbox in the header should be selected.
3. We also need a client side confirmation, on the number of rows to be deleted. The selected rows should be deleted from the database table, only when OK button is clicked. If cancel button is clicked, the form should not be posted to the server, and no rows should be deleted.

[script type="text/javascript" language="javascript"]
$(function () {
$("#checkAll").click(function () {

$("input[name='employeeIdsToDelete']").click(function () {
if ($("input[name='employeeIdsToDelete']").length == $("input[name='employeeIdsToDelete']:checked").length) {
$("#checkAll").attr("checked", "checked");
}
else {
$("#checkAll").removeAttr("checked");
}
});

});
$("#btnSubmit").click(function () {
var count = $("input[name='employeeIdsToDelete']:checked").length;
if (count == 0) {
alert("No rows selected to delete");
return false;
}
else {
return confirm(count + " row(s) will be deleted");
}
});
});
[/script]

jQuery file can also be referenced from the following website

Make sure to replace [ with LESSTHAN and ] with GREATERTHAN symbol.

[Csharp-video-tutorialsBlogspot]

Thank you very much for taking time to give feedback. For email alerts, when new videos are uploaded, please subscribe to my channel. In the description of this video, I have included the link for ASP .NET, C#, and SQL Server playlists. All the videos are arranged in logical sequence in these playlists, which could be useful to you. Please share the link with your friends who you think would also benefit from them. If you like these videos, please click on the THUMBS UP button below the video.

[imranbhatti]

nice work done kudvenkat, good job done, well done

[neilsukalikar]

New version jquery doesn't support attr attribute and the example given in this wont work 

below is updated query 

<link rel="stylesheet" />
<script

<script type="text/javascript">
    $(document).ready(function () {

        $("#chkAll").click(function () {
            $("input[name='employeeIdsToDelete']").prop("checked", this.checked);
        });

        () {
            debugger;
            if == {
                $("#chkAll").prop("checked", true);
            }
            else {
                $("#chkAll").prop("checked", false);
            }
        });
    });
</script>

[trades]

I found I had to replace the attr with prop for jquery-1.10.2.min.js. Otherwise it functions just fine.

[basharkhdr]

for full functionality using latest JQuery version. Use prop instead of attr, and replace removeProp with the following line ----> $("#checkAll").prop("checked", "");
I hope this'd help you.

[KhalidAfridi]

Amazing but difficult javascript coding... 😊 Thank you so much sir. YOU are amazing.

[shohailaamil]

Really thankful for this valuable content

[Kumadec]

what is the different between local folder jquery and hosted jquery and the advantages of using Local and Hosted jQuery, can you please explain

[rithup]

Very good session. I have a question. How to make select all work only for current page when there is pagination available.

[ahmed-dfyg]

Thanks for this great work.. What about if i want 1 checkbox only to be selected not multiple?!

[raphaelcomba]

Thanks you saved me with that video!!!

[arun]

my jquery is running only once after i refresh the page after that i have to refresh page again to select all and deselect all please help!!

[commonman]

Hi sir, I am using jquery dataTable to display a table row in my JSP, dataTable return collection of hidden type fields, now i need to get all hidden fields value in javascript, but problem is dataTable displaying rows with pagination, so when I am in page 1, iIcan get only first page rows hidden field value in javascript, not able to get all page rows.

[sandipdatta]

removeAttr is not working. I checked removeprop, but not lucky. Can you help me to find the solution to alternate this method.

[GauravKumar-srbt]

how can multiple DOM elements have same ID, in this case, all the checkboxes are having same ID.

[breathlessmp]

hi i am having some difficulties trying to implement the example you have listed here on the vid demonstration
i am working on a pdf form and at the moment is still trying to implement this jquery you applied

i am a newbie with scripting and its a bit difficult for me can you assist me!!
ok, os that said is that i am trying to implement the same functionality only that it is on a pdf form utilizing adobe acrobat pro

[kavithavishwanathen]

Thank you my angel i get select deselect only once if repeated then it dosnt select or deselect ....it happens only if i refresh the page again and again....plz reply

[ouchbros]

Hi sir, please write code how insert multiple rows to two tables! i want to know it! thanks

[eduardosantana]

And if I have more than 1 page, and i want to select all checkboxes of all pages, what do i have to do?

[gowthamasohan]

how to avoid selecting the disabled checkbox..when selecting all checkbox