Changing Selected Option in a Drop Down Menu in Javascript
Question
I have this code and I want to change the selected item,being Million(s), to something other than that. How would I do this?
<td>
<select name='list_" + i + "' id='list'>
<option value='0'>Trillion(s)</option>
<option value='1' selected='selected'>Billion(s)</option>
<option value='2'>Million(s)</option>
<option value = '3'>Below One Million</option>
</select>
</td>
Here is the lines of code im using to try to change the selected option
for (var key in myObject) {
if (myObject.hasOwnProperty(key)) {
if(document.getElementById("list_"+counter).innerHTML=="true"){
document.getElementById("c" + counter).value = myObject[key];
counter++;
}else{
if(myObject[key]>=1.0E12){
myObject[key]=myObject[key]/1.0E12;
//document.getElementById("list").value=counter;
//document.getElementById("list").getElementsbyTagName('option')[counter].value=counter;
counter++;
}
document.getElementById("c" + counter).value = myObject[key];
}
}
}
1 answers
solution1
0 ACCPTED 2014-02-05 00:56:40
I may have understood your requirement wrong.
If you want to change the selected item then it is just matter of changing "selected" attribute.
Let say I want to change it to Trillion, then this is how the code will look like:
<select name='list_" + i + "' id='list'>
<option value='0' selected='selected'>Trillion(s)</option>
<option value='1' >Billion(s)</option>
<option value='2'>Million(s)</option>
<option value = '3'>Below One Million</option>
</select>
Now let say you want to change the selected item through pure javascript(NO JQUERY)
Here is full example, the selected item will change when you click button. Note: It is just a matter of changing the index.
<head>
<title> Changing selected option in drop-down menu in JS</title>
<script type="text/javascript">
function changeSelected(){
document.getElementById("list").selectedIndex = 1;
};
</script>
</head>
<body>
<p> Test string....</p>
<td>
<select name='list_" + i + "' id='list'>
<option value='0' selected='selected'>Trillion(s)</option>
<option value='1' >Billion(s)</option>
<option value='2'>Million(s)</option>
<option value = '3'>Below One Million</option>
</select>
<button onclick="changeSelected()">Try It</button>
</td>
</body>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.