Reputation: 11275
I have a HTML form with a few select elements. One of the option in each of these elements has been disabled initially. Example:
<label>Amount: <select name="amount">
<option selected value='0'>Any</option>
<option value="1">100+</option>
<option value="2">200+</option>
<option value="3">500+</option>
<option disabled value="4">Specify</option>
</select></label>
I need to enable them with javascript. Is there a good way to target these elements without using jQuery?
Upvotes: 0
Views: 2718
Reputation: 59292
This will take care of all disabled elements and is simple.
You can do this:
var elems = document.querySelectorAll('[disabled]'); // target all disabled elemnts
for (var i = 0; i < elems.length; i++) {
elems[i].removeAttribute('disabled'); // enable them.
}
Upvotes: 2
Reputation: 7070
JS:
var ddl = document.getElementsByTagName("select");
for (var m = 0; m < ddl.length; m++) {
for (var i = 0; i < ddl[m].length; i++) {
ddl[m].options[i].disabled = false;
}
}
Upvotes: 2
Reputation: 147563
If you want to enable every option element in the document, you can do:
var options = document.getElementsByTagName('option');
for (var i=0, iLen=options.length; i<iLen; i++) {
options[i].disabled = false;
}
If you want to enable only the options for a specific select element, first get a reference to it then use its options collection:
var options = select.options;
// continue as as above...
Upvotes: 2