How to set default value for HTML select?
Note: this is JQuery. See Sébastien answer for Javascript
$(function() {
var temp="a";
$("#MySelect").val(temp);
});
<select name="MySelect" id="MySelect">
<option value="a">a</option>
<option value="b">b</option>
<option value="c">c</option>
</select>
You first need to add values to your select
options and for easy targetting give the select
itself an id
.
Let's make option b
the default:
<select id="mySelect">
<option>a</option>
<option selected="selected">b</option>
<option>c</option>
</select>
Now you can change the default selected value with JavaScript like this:
<script>
var temp = "a";
var mySelect = document.getElementById('mySelect');
for(var i, j = 0; i = mySelect.options[j]; j++) {
if(i.value == temp) {
mySelect.selectedIndex = j;
break;
}
}
</script>
Also we can use "text" property of i to validate:
if(i.text == temp)
See it in action on codepen.