开发者

Enable/Disable dropdown - Javascript

开发者 https://www.devze.com 2023-02-19 08:01 出处:网络
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 disable

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 开发者_JAVA技巧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>


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}


You don't necessarily need

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

精彩评论

暂无评论...
验证码 换一张
取 消