• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 280
  • Last Modified:

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';
                                                                 }
0
help-is-needed
Asked:
help-is-needed
  • 4
  • 4
  • 3
  • +1
2 Solutions
 
EyalCommented:
do you have jQuery in that page?
0
 
help-is-neededAuthor Commented:
I can use Jquery yes.
0
 
help-is-neededAuthor Commented:
Im using a <select multiple="multiple"><option></option></select> box
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
chaitu chaituCommented:
<select multiple="multiple"><option>1</option><option>2</option></select>
0
 
chaitu chaituCommented:
<select id='sel' multiple size='10'>
0
 
sonawanekiranCommented:
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
 
sonawanekiranCommented:
0
 
sonawanekiranCommented:
Updated version : http://jsfiddle.net/GdMaw/1/
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

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 4
  • 4
  • 3
  • +1
Tackle projects and never again get stuck behind a technical roadblock.
Join Now