JavaScript Check All Checkboxes
20070425
Have you ever used a site with a bunch of checkboxes, and you needed to check all of the checkboxes but they didn’t provide that feature directly in their user interface? You might shrug, and click away until the job is done… or use the “JavaScript command line” aka your browser’s address bar, to do it the power-user way.
I realize that may not be a common problem, but in my day job I kept running into it while adding hundreds of keywords at MSN’s adCenter (wanting all of them to use all match types).
Hasn’t someone else already solved this problem? Seems very likely, but my searches were only pulling up examples of “check all” functions to use on your own site, so after a bit of coding I present to you my check-all checkboxes function:
function check_all_in_document(doc)
{
var c = new Array();
c = doc.getElementsByTagName('input');
for (var i = 0; i < c.length; i++)
{
if (c[i].type == 'checkbox')
{
c[i].checked = true;
}
}
}
As the name suggests, it finds all checkboxes in a given document and checks them. Pretty simple. It accepts as an argument a document object, allowing for easy iteration through frames with a function like this:
function checkem()
{
check_all_in_document(window.document);
for (var j = 0; j < window.frames.length; j++)
{
check_all_in_document(window.frames[j].document);
}
}
This function simply iterates through frames to ensure all checkboxes in all frames get checked. An important bit of brute force when dealing with a problem like mine, with MSN adCenter, where my first attempt failed because of frames trickiness.
Instead of using these as functions in your own page (though they can work for that if need be), they’re meant to be combined in one power tool for your browser. Here’s the one-liner you can paste in your browser’s address bar for instant gratification:
The one-liner version also works well as a browser button/bookmarklet, if you like having it handy.
Update (20070506): MSN adCenter recently changed their interface, now the check all checkboxes script doesn’t work (probably checking a hidden checkbox that relates to an Ajax/navigation feature, going by the alert). However they also added a “bulk edit” feature that allows the various match type checkboxes to be set en masse. Did somebody over there read this post? Or was it actually that the bulk edit feature was there all along and I just didn’t notice until their update? Hmm.
Either way, this little JavaScript is still valid and I don’t doubt there are other instances where it may find use.
20070713 17:54
Thanks for the script! I was trying to figure out how to do something like this, and seeing your example solved the problem I was having.
20070715 22:12
You’re welcome Eric! Good to know someone else out there is able to find this useful.
20070815 15:31
[...] found a very interesting and useful piece of code at 3DM Design which allows you to select all checkboxes on a webpage. I found this particularly useful for a [...]
20080910 20:18
be careful – there are incorrect single-quotes in the script above. Search and replace ’ with ‘
20080913 12:03
Good catch! I’ve fixed the character encoding, you should be able to safely copy and paste the code now.
20081014 14:54
That is absolutely awesome! I’ve been looking for a quick and easy way to do this for some time now. I’ve added the function as a link and now I have a “button” I can press to check all the check boxes.
Thank-you!!!!
20081014 20:59
Glad you like it Dan, enjoy!
20081025 10:10
Thanx, nice code.
20081025 10:18
You’re welcome :-)
20090209 15:17
i like it
how can i create a button for using this script instead of putting it in the browser address bar.
thanks
20090214 17:49
Try adding a bookmark to your browser’s toolbar, then edit the bookmark’s url and paste the one-liner above.
20101017 10:11
Great piece of script ! I used in the comb section of webcitation.org wherein over 1000+ links on single directory listing webpage had created hassle for me.
Your solution makes my work so much faster and better !
God bless you, Scott !
Grateful,
Manu
20101018 07:28
Good to hear, thanks Manu!
20101101 23:35
how can i check checkbox bulk checking with php script
20110318 02:16
I was trying to write one of these for facebook group freinds invites. Thank you so much for saving me a lotta time heh: ) cool stuff.
20110327 09:54
Glad you like it Nick!
20110331 06:36
[...] for writing this script goes to 3DM Design Posted by Andrew Sparks @ 31 March 2011 0 comments Tags : address bar , [...]
20110806 09:52
nice.!
20110917 10:52
THANKS SO MUCH FOR THIS! Makes life a billion times easier.
20110919 16:54
This saves me A TON of time in my day to day duties. I appreciate this nifty little trick!!!
20111128 20:24
I used to use this script with great success for inviting friends to events on facebook, but now I’ve found that the browsers seem to function differently, and, instead of applying the script as a command to an existing page, the browsers are treating it as if I am typing in a web address, and they are pulling up a page saying website not found, or something to that effect. I’ve tried this on Chrome, IE, and Safari, without success (but it used to work!) Is there a way around this?
20111201 08:34
“javascript:” at the beginning of the line should indicate to the browser to execute the stuff that follows, when you enter it in the address bar. If not you might be able to get around the search problem by turning off an option to search from the address bar (but it makes things inconvenient the rest of the time). With JavaScript turned on this shouldn’t be an issue when copying, as clicking the box with the one-liner version should select everything, but make sure too that you’re not missing, say, the first “j” or something when you enter the code.