Javascript: Select all options for a select box

Posted by Stewart Orr on 16 Feb 2007 with the tags Javascript Comments (8)

Here's a javascript function that will allow the user to select all or none of the options in a multiple select box. It is quite simple to use, first either provide the id of the select box or the actual select box object and it will do the rest.

Home
Blog
Javascript: Select all options for a select box

Selecting all select options

This example will select all options for the select box with the id 'selectbox1':-

<input type="button" name="Button" value="All" onclick="selectAll('selectbox1',true)" />

And this example will select none of the options for the select box by passing the select object and saying we don't want them all selected (false):-

 <input type="button" name="Button" value="All" onclick="selectAll(document.getElementById('selectbox2'),false)" />

The function

Just pass the ID of the element or and whether you want all of the options selected or not and it'll do the rest!

function selectAll(selectBox,selectAll) { 
    // have we been passed an ID 
    if (typeof selectBox == "string") { 
        selectBox = document.getElementById(selectBox);
    } 
    // is the select box a multiple select box? 
    if (selectBox.type == "select-multiple") { 
        for (var i = 0; i < selectBox.options.length; i++) { 
             selectBox.options[i].selected = selectAll; 
        } 
    }
}

Of course, If your select box is not a multiple select, it will do nothing! If this has been of some help to you, let me know!

Download the example JavaScript: Select all options in a select box now!

Comments (8)

What others have said about this blog post.

27 Aug 2007 br41nless said:

thank you stewart
19 Feb 2008 miles said:

MANY thanks this helped me immediately with a problem I was having!
09 Oct 2008 Worrawat Sakulwong said:

thank you
13 Jul 2009 Synbios said:

thanks mate, you saved me a lot of researching in javascript :D
01 Sep 2009 Bill Bartmann said:

I'm so glad I found this site...Keep up the good work
02 Sep 2009 Bill Bartmann said:

This site rocks!
24 May 2010 mahen said:

That really helped. Thank you very much
05 Jun 2010 Knight Samar said:

Thanks! That was neat :)