CODEWITHSUNDEEP
javascripthtmlcss
user2729868
user2729868

Reputation: 17

How can change disabled style for select box with javascript

I want to change the second's select box disabled style when the first select box is changed but I can't. Please help me.

<html>
    <body>
        <select onchange="a()" id="1">
            <option>Choose</option>
            <option>1</option>
            <option>2</option>
        </select>
        <select id="2" disabled="true">
            <option>one</option>
            <option>two</option>
        </select>
        <script>
            function a(){
                if(document.getElementById('1').value!="Choose"){
                    document.getElementById('2').style.background="yellow";
                    document.getElementById('2').style.disabled="false";
                }
            }
        </script>
   </body>
</html>

Upvotes: 1

Views: 14718

Answers (3)

matewka
matewka

Reputation: 10168

disabled is an attribute, not style property. That should do:

function a(){
    if(document.getElementById('1').value!="Choose"){
        document.getElementById('2').style.background = "yellow";
        document.getElementById('2').disabled = false;
    }
}

Upvotes: 0

Niet the Dark Absol
Niet the Dark Absol

Reputation: 324790

disabled is a property of the element, NOT its style collection.

document.getElementById('2').disabled = false;

It is also important to note that 1 and 2 are NOT valid IDs in HTML older than HTML5, which means older browser may have severe issues with it (such as not recognising it as an ID, not finding it with getElementById, not styling it, etc.) I suggest giving meaningful IDs, even if it's just select1 and select2, that helps reduce the chance of accidentally duplicating IDs.

Upvotes: 3

hazerd
hazerd

Reputation: 592

The "disabled" part is an attribute of the select element, not a CSS property.

Try this instead :

document.getElementById('2').disabled=false;

Upvotes: 0

Related Questions