In jquery uncheck all checkboxes, Welcome on Pakainfo.com – Examples ,The best For Learn web development Tutorials,Demo with Example! Hi Dear Friends here u can know to Check and Uncheck all Multiple Checkbox using jQuery
Check and Uncheck all Multiple Checkbox using jQuery
In this post we will show you Best way to implement Check or Select / Deselect all Checkboxes using jQuery, hear for How to checkbox – jquery check uncheck all checkboxes with a button with Download .we will give you demo,Source Code and examples for implement Step By Step Good Luck!.
External include libs
At First of all you need to External include the jQuery CDN or library.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
Example 1 : Multiple Checkbox Select and Deselect using jQuery
HTML markup Part(index.html)
<form action="#"> <p><label><input type="checkbox" id="livecheckall"/> Check all</label></p> <fieldset> <legend>All the Options Avialbles : Loads of checkboxes</legend> <p><label><input type="checkbox" /> Pakainfo.com 1</label></p> <p><label><input type="checkbox" /> Pakainfo.com 2</label></p> <p><label><input type="checkbox" /> Pakainfo.com 3</label></p> <p><label><input type="checkbox" /> Pakainfo.com 4</label></p> </fieldset> </form>
JavaScript Part (index.js)
$("#livecheckall").change(function () { $("input:checkbox").prop('checked', $(this).prop("checked")); });
Example 2 : Select and Deselect all checkboxes using jQuery
HTML markup Part(index.html)
<ul class="main"> <li><input type="checkbox" id="livecheckall" /> Select all</li> <ul> <li><input type="checkbox" class="liveck" value="1"/>Live24u Products 1</li> <li><input type="checkbox" class="liveck" value="2"/>Live24u Products 2</li> <li><input type="checkbox" class="liveck" value="3"/>Live24u Products 3</li> <li><input type="checkbox" class="liveck" value="4"/>Live24u Products 4</li> <li><input type="checkbox" class="liveck" value="5"/>Live24u Products 5</li> </ul> </ul>
JavaScript Part (index.js)
<script type="text/javascript"> $(document).ready(function(){ $('#livecheckall').on('click',function(){ if(this.checked){ $('.liveck').each(function(){ this.checked = true; }); }else{ $('.liveck').each(function(){ this.checked = false; }); } }); $('.liveck').on('click',function(){ if($('.liveck:checked').length == $('.liveck').length){ $('#livecheckall').prop('checked',true); }else{ $('#livecheckall').prop('checked',false); } }); }); </script>
I hope you have Got jquery uncheck all checkboxes And how it works.I would Like to have FeadBack From My Blog(Pakainfo.com) readers.Your Valuable FeadBack,Any Question,or any Comments abaout This Article(Pakainfo.com) Are Most Always Welcome.
I am Jaydeep Gondaliya , a software engineer, the founder and the person running Pakainfo. I’m a full-stack developer, entrepreneur and owner of Pakainfo.com. I live in India and I love to write tutorials and tips that can help to other artisan, a Passionate Blogger, who love to share the informative content on PHP, JavaScript, jQuery, Laravel, CodeIgniter, VueJS, AngularJS and Bootstrap from the early stage.