How to Check all HTML Checkboxes using JavaScript

JavaScript is a very powerful language with which many innovative things could be achieved, like I posted earlier how you can accept all your facebook friend requests using javascript hack, even tagging all your friends in one post could be done using this miracle language.

Also: 7 Coolest JavaScript Tricks & Hacks you should check out !

Once in a while you'll stumble upon a site or web page with a lot of HTML checkboxes, and you wish to examine them all. This is a typical scenario to come across as a web designer likewise. Nevertheless, if there are a great deal of checkboxes this procedure ends up being time consuming, particularly if you're doing it consistently while establishing something. With Google Chrome's console (or Firefox) and a little bit of Javascript it ends up being a breeze.

Check all Checkboxes in Chrome & Firefox with JavaScript

So now in case you are using chrome or firefox you are lucky enough as this works in both of these browsers, so there is a simple step by step tutorial, check it out.

1. Open up the page where you are multiple number of checkboxes to tick.
2. Now you'll have to do is to open the browser Console window. In Google Chrome this can be accomplished by striking CTRL + SHIFT + J and CTRL + SHIFT + K in Firefox.
3. This console enables us to "INJECT" Javascript straight. This is an actually useful tool for screening Javascript and AJAX operations.

   var getInputs = document.getElementsByTagName("input");
   for (var i = 0, max = getInputs.length; i < max; i++){ if (getInputs[i].type === 'checkbox') getInputs[i].checked = true; }

4. Now you need to copy and paste the above javascript inside that console window like in the image below.
   
5. After its pasted press enter and see all the check boxes automatically checked and now all your manual work is gone.

The very first line of code picks all the input tags on the page. It then goes into a loop for each of those input's, check's if that certain input is of type "checkbox", and sets the "checked" property to true if it is. The very same code can be made use of to uncheck all checkboxes, with one little tweak: make below change.

"getInputs[i].checked = true;" with "getInputs[i].checked = false;"

That's it now your hard work is completed using this smart trick and all your check boxes are checked automatically, so now utilizing this simple javascript tricks your work could be done in seconds.