Perhaps i'm misunderstanding here, but given the following html:
<select value="2"> <option value="1">Something</option> <option value="2">Something else</option> </select> I would expect "Something else" to be the default selected option. However, it does not seem to be. Why is this, and what should I be doing differently?
You use selected attribute on an option element to specify default option.
<select> <option value="1">Something</option> <option value="2" selected="selected">Something else</option> // this is default </select> 
The only way to have a default option is to have selected in the option tag.
<SELECT> <OPTION>Something <OPTION SELECTED>Something Else 
React JS
Some coding implementations such as ReactJS allow you to use a value attribute with the <select> tag so this would be perfectly valid code:
<select value="2"> <option value="1">Something</option> <option value="2">Something else</option> </select> So if you are seeing code examples like this it is likely because it is in React or other similar library/framework.
Of course, with this approach, typically you would want to specify the value in state, so that it is updateable.
HTML with Attribute Minimization:
However, if you are using purely HTML you must use the selected attribute in your <option> tag as follows:
<select> <option value="1">Something</option> <option value="2" selected>Something else</option> </select> HTML with Full Attribute Specification:
The above uses attribute minimization, but you can also specify the full form if you want:
<select> <option value="1">Something</option> <option value="2" selected="selected">Something else</option> </select> 
value in your select tag is basically just setting the default option. It makes things easier from a dynamic perspective because, if you are wanting to display a specific option that is selected, normally, you would have to go through each option and find the value you are after, and then add the selected attribute. With React JS and some other implementations, all you need to do is update the value attribute of the select tag and it does it all for you.The <select> element does not have a value attribute so that is ignored. So, you have a single selection <select> and none of its <option> elements have the selected attribute, that means that the first <option> is taken as the default selection.
I know this post is quite old but in case anyone else is struggling with this you can implement the functionality you are looking for using jquery.
The full code using php would be something like this
PHP
if ($_SERVER['REQUEST_METHOD']== "POST") { $thing = $_POST['things']; } else { $thing =""; } HTML
<select name='things' value="<?php echo $thing; ?>"> <option value="1">Something</option> <option value="2">Something else</option> </select> JQUERY
$(function() { $("select[value]").each(function() { $(this).val(this.getAttribute("value")); }); }); //end document ready This will allow the select options chosen by the user to remain selected after the page has re-loaded via post instead of returning to the default values.
You have to use select attribute. in below code, a swift option will be selected by default
<select name="myCar" id="car"> <option value="ind">Indica</option> <option value="swf" selected>Swift</option> </select>