Enable/Disable dropdown - Javascript

Question

I have the following code where 2 drop downs are available on the UI. When I select value "1" of drop down 1, the drop down 2 should be disabled. When I select value "1", the dropdown 2 is disabled. But I am not able to re-enable the drop down 2 when the user select value "2" from drop down 1. I am not sure since I am calling the performValidation() method for onClick event of both the options in drop down 1.

Code:

<html>
<head></head>
<script = "text/javascript">
     function performValidation()
     {
           if (document.mainForm.criteriaOne.value == "1")
           {
                document.mainForm.criteriaTwo.options.length = 0;
                document.mainForm.criteriaTwo.disabled = true;
           }
           else
                document.mainForm.criteriaTwo.disabled = false;
     }
</script>
<body>
        <form name="mainForm" action= "" method ="get">
              Criteria One:<select id = "criteriaOne">
             <option value = "1" onClick ="performValidation()"> Select One - One</option>
             <option value = "2" onClick ="performValidation()"> Select one - Two</option>
              </select>
              Criteria Two:<select id = "criteriaTwo">
             <option value = "1" onClick ="performValidation()"> Select Two - One</option>
              </select>
         </form> 
</body>
</html>

Not sure, your code works for me as is in Firefox 4.0

Duniyadnd
– Duniyadnd

2011-03-24 20:18:10 +00:00
Commented Mar 24, 2011 at 20:18 — Duniyadnd
– Duniyadnd, Commented Mar 24, 2011 at 20:18

Andrew · Accepted Answer · 2011-03-24 20:04:07Z

2

You need to wire up a function to the onchange event on the select something like

document.getElementById("criteriaOne").onchange = function() 
         { // do some work to check the selectedIndex and determine whether to re-                enable the other drop down}

answered Mar 24, 2011 at 20:04

Andrew

5,2752 gold badges27 silver badges45 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Duniyadnd · Accepted Answer · 2011-03-24 20:03:25Z

0

You don't necessarily need

document.mainForm.criteriaTwo.options.length = 0;

answered Mar 24, 2011 at 20:03

Duniyadnd

4,0431 gold badge24 silver badges30 bronze badges

1 Comment

name_masked Over a year ago

presence/absence of that line doesn't solve my problem however !

Collectives™ on Stack Overflow

Enable/Disable dropdown - Javascript

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related