Select all checkbox using jquery

Select all checkbox using jquery

In this post we will show you Select all checkbox using jquery, hear for Select all checkbox using jquery we will give you demo and example for implement.

Today I will show a quick and easy method on how to make a select all checkbox to select all checkboxes real time using Jquery. It is very easy.

 The HTML code is given below

<div class="row">
    <div class="col-md-3 "> 
        Select All : <input id="checkall" class='' type="checkbox" >
    </div>
   
    <div class="col-md-3" >
        Checkbox 1 :<input value="1" class='checkboxes' type="checkbox" name="checkboxes[]">
    </div>
    <div class="col-md-3" >
        Checkbox 2 :<input value="2" class='checkboxes' type="checkbox" name="checkboxes[]">
    </div>
    <div class="col-md-3" >
        Checkbox 3 :<input value="3" class='checkboxes' type="checkbox" name="checkboxes[]">
    </div>
</div>

 The Jquery Code is given below.

 $("#checkall").click(function (){
     if ($("#checkall").is(':checked')){
        $(".checkboxes").each(function (){
           $(this).prop("checked", true);
           });
        }else{
           $(".checkboxes").each(function (){
                $(this).prop("checked", false);
           });
        }
 });

Here the jquery function first check whether id named checkall is checked or not if checked it will iterate all checkboxes with under the class checkboxes using each function in jquery. At each iteration the checkbox is checked using prop function which set the property of checkbox to true.

Hope this code and post will helped you for implement "Select all checkbox using jquery. if you need any help or any feedback give it in comment section or you have good idea about this post you can give it comment section. Your comment will help us for help you more and improve onlincode. we will give you this type of more interesting post in featured also so, For more interesting post and code Keep reading our blogs onlincode.org