First option of dropdown not an option; force to use other options
Just give display:none
to the element option
and disabled=disabled
. Thanks to @pixshatterer
http://jsfiddle.net/Xh9nh/4/
EDIT : Put visibility:hidden
by mistake.
edit: this code is only to force users to choose a valid option, instead of the one by default... validation for submit/change/etc should be added
You should just disable the first option and setting it as selected by default:
<select name="name">
<option disabled="disabled" selected="selected">Select an option.</option>
<option>A</option>
<option>B</option>
<option>C</option>
</select>
That should do the trick, demo here http://jsfiddle.net/pixshatterer/Q27HX/
If you use the Validation plugin (here: http://jqueryvalidation.org/) and update your <select>
to supply value
on each <option>
, it will prevent form submission if the "empty" value is selected:
<select name="name" required>
<option value="">Select an option...</option>
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
</select>
It's also worth noting that the only valid child elements of a <select>
is either <optgroup>
or <option>
, so remove those <br />
s.
If jQuery is not an option, you could always add an onclick
to the select or an onsubmit
to the form and do a quick check on an empty string (or whatever you set the default value to).