using javascript to select multiple combobox options

Hi,

I would like to embed some js on a page that will prepopulate a combo box with two selected options.

How is this done in js?

I have it so that it does one...

populateTest();
                                                                 function populateTest() {
                                                                     var option1 = document.getElementById("testElement");
                                                                     option1 .value = '1';
                                                                 }
help-is-neededAsked:
Who is Participating?
 
Kiran SonawaneProject LeadCommented:
Updated version : http://jsfiddle.net/GdMaw/1/
0
 
EyalCommented:
do you have jQuery in that page?
0
 
help-is-neededAuthor Commented:
I can use Jquery yes.
0
Cloud Class® Course: Microsoft Exchange Server

The MCTS: Microsoft Exchange Server 2010 certification validates your skills in supporting the maintenance and administration of the Exchange servers in an enterprise environment. Learn everything you need to know with this course.

 
help-is-neededAuthor Commented:
Im using a <select multiple="multiple"><option></option></select> box
0
 
chaitu chaituCommented:
<select multiple="multiple"><option>1</option><option>2</option></select>
0
 
chaitu chaituCommented:
<select id='sel' multiple size='10'>
0
 
Kiran SonawaneProject LeadCommented:
Check below code

Demo: http://jsfiddle.net/qFfG8/1/
<html>
<head>
<meta http-equiv="Content-Language" content="en-gb">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Kiran Test</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>

<script>
$(document).ready(function(){
 
    populateTest();
});




function populateTest()
{
$("#testElement").html("<option value='1'>Option 1</option><option value='2'>Option 2</option>")  ;
    
}


  
</script>
</head>

<body>

<select id="testElement" multiple="multiple"></select>

</body>

</html>

Open in new window

0
 
EyalCommented:
0
 
help-is-neededAuthor Commented:
Erm, I think I may not have got my issue across clearly.

I have an option list on my html page. example:

<select multiple="multiple" size="5" id="testOptions">
                                                    <option selected="selected" value="">please select</option>
                                                    <option value="test1">help</option>
                                                    <option value="test2">is</option>
                                                    <option value="test3">needed</option>
                                                    <option value="test4">please</option>
                                                    <option value="test5">thanks</option>
                                                </select>

What I would like to do is to pre-select two of the options when the page loads.
I currently have it working so that it can default select one of the options but I need to be able to default select two options.

populateTest();
                                                                 function populateTest() {
                                                                     var option1 = document.getElementById("testOptions");
                                                                     option1.value = 'test2';
                                                                 }
0
 
Kiran SonawaneProject LeadCommented:
0
 
chaitu chaituCommented:
var maxSel = 5;
var selected =[];
window.onload=function() {
  saveSel(document.getElementById('sel')); // initialise
}
function saveSel(sel) {
  for (var i=0;i<sel.options.length-4;i++) {
    sel.options[i].selected=true; 
  }
}

<select id='sel' multiple onChange="test(this)" size='10'>
<option value='1'>One</option>
<option value='2'>Two</option>
<option value='3'>Three</option>
<option value='4'>Four</option>
<option value='5'>Five</option>
<option value='5'>Six</option>
</select>

Open in new window

0
 
help-is-neededAuthor Commented:
sonawanekiran, thats it.
How do I use that same code to deselect?

many thanks
0
 
EyalCommented:
$("#testOptions option[value=test1], #testOptions option[value=test2]").removeAttr('selected');
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.