javascript - enable or disable option from select -


i trying make option either selectable or non-selectable based on whether or not chose option. example, if there options 1-6 , have not chosen option 1 in first select box, in same select box , other in form, option 6 not chosen.

i looked around, clicking button achieve this.

this code have (i have tried onclick)

   <script type="text/javascript">       function makedisable(){       var x=document.getelementbyid("myselect2");       x.disabled=true       }      function makeenable(){          var x=document.getelementbyid("myselect2");           x.disabled=false      }</script>      <form>         <select class="myselect" id="myselect">         <option onchange="makeenable()" value="enable list">apple</option>         <option onchange="makedisable()" value="disable list">banana</option>         <option id="myselect2" disabled="true">orange</option>     </select>     </form> 

option elements don't have event "onchange", select elements do.

i've wrote code snippet below. may add more select items. when choose option in 1 of select elements, shouldn't choose options @ same index in other select elements.

<script type="text/javascript">   function toggledisability(selectelement){    //getting select elements    var arrayselects = document.getelementsbyclassname('myselect');    //getting selected index    var selectedoption = selectelement.selectedindex;    //disabling options @ same index in other select elements    for(var i=0; i<arrayselects.length; i++) {     if(arrayselects[i] == selectelement)      continue; //passing selected select element      arrayselects[i].options[selectedoption].disabled = true;    }   }  </script>  <form>  <select onchange="toggledisability(this);" class="myselect" id="myselect1">     <option>apple</option>     <option>banana</option>     <option>orange</option>  </select>  <select onchange="toggledisability(this);" class="myselect" id="myselect2">     <option>hamburger</option>     <option>pizza</option>     <option>cola</option> </select> </form> 

Comments

Popular posts from this blog

c++ - Creating new partition disk winapi -

Android Prevent Bluetooth Pairing Dialog -

php - joomla get content in onBeforeCompileHead function -