Menu
<select name="name">
<option>Select an option.</option><br/>
<option>A</option><br/>
<option>B</option><br/>
<option>C</option><br/>
</select>
HTML5 has required="required", and this is the kind of effect I want with the dropdown above. I don't want the user to select "Select an option", only "A", "B", or "C". I know I could set a default value of A and just remove the "Select an option" option entirely, but I don't want users to click haphazardly without reading the options available.
Can this be done with HTML and/or JS?
922
Select the <select> element using JQuery selector. This selector is more specific and selecting the first element using option:nth-child(1). This will get access to the first element (Index starts with 1).
To select multiple options in a drop-down list, use the multiple properties. It allows you to select more than one option while pressing CTRL key.
Create a local variable say type that will hold any of the array based on the dropdown selected. Create a function that will be called whenever an option from the dropdown is selected, this function will change the state variable so that the value of type can be determined dynamically.
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/
152
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
