onChange i onSelect w DropDownList

Mam DropDownList, który pyta użytkownika, czy chce dołączyć do klubu:onChange i onSelect w DropDownList

Do you want to join the club 
Yes 
No

ramach tej liście jest inna lista, która jest ustawiona na niepełnosprawnych jako domyślny. Ta lista zawiera działy klubu. Ta lista nie zostanie włączona, dopóki użytkownik nie wybierze opcji Tak.

Zbudowałem następujący kod, ale problemu, który nie mogłem rozwiązać, załóżmy, że użytkownik wybiera opcję Tak, a następnie zmienia decyzję, aby ponownie wybrać opcję Nie. W tym przypadku lista departamentów jest nadal włączona. Chcę, żeby był wyłączony, kiedy ponownie wybierze Nie.

<html> 
    <head> 
     <script type="text/javascript"> 
      function disable() 
      { 
       document.getElementById("mySelect1").disabled=true; 
      } 
      function enable() 
      { 
       document.getElementById("mySelect1").disabled=false; 
      } 
     </script> 
    </head> 
    <body> 
     <form> 
      <select id="mySelect" onChange="enable();"> 
       <option onSelect="disable();">No</option> 
       <option onSelect="enable();">Yes</option> 
      </select> 
      <select id="mySelect1" disabled="disabled" > 
       <option>Dep1</option> 
       <option>Dep2</option> 
       <option>Dep3</option> 
       <option>Dep4</option> 
      </select> 
     </form> 
    </body> 
</html>

Myślałem, że onSelect="disable();" rozwiązałoby problem, ale nadal nie działa.

Dzięki

Źródło

2012-03-29 Nasser

Wygląda na to, że przyciski radiowe będą bardziej odpowiednie. Ponadto, 'onselect' nie jest poprawnym atrybutem dla elementów select i option. – RobG

zrobiłbym to jak ten jsFiddle example.

JavaScript:

function check(elem) { 
    document.getElementById('mySelect1').disabled = !elem.selectedIndex; 
}

HTML:

<form> 
<select id="mySelect" onChange="check(this);"> 
<option>No</option> 
<option>Yes</option> 
</select> 

<select id="mySelect1" disabled="disabled" > 
<option>Dep1</option> 
<option>Dep2</option> 
<option>Dep3</option> 
<option>Dep4</option> 
</select> 
</form>

Źródło

2012-03-29 23:53:10 j08691

Założę onchange jest wyrzucenie po onselect zasadniczo ponowne włączenie select.

Zalecam, aby zaimplementować tylko z onchange, sprawdzić, która opcja została wybrana, i włączyć lub wyłączyć na podstawie tego.

Aby uzyskać wartość wybranego użyć opcji:

document.getElementById("mySelect").options[document.getElementById("mySelect").selectedIndex].value

Który przyniesie .. nic, ponieważ nie określono wartości dla każdej z opcji .. :(

<select id="mySelect" onChange="enable();"> 
<option onSelect="disable();" value="no">No</option> 
<option onSelect="enable();" value="yes">Yes</option> 
</select>

teraz będzie to wydajność "yes" lub "no"

Źródło

2012-03-29 23:39:22 Halcyon

Aby solidną formę, ma ona wczytać w użyteczny skrypt państwowej i wykorzystania w celu zwiększenia jego zachowanie. W dalszej części wybór został zastąpiony przyciskami radiowymi (znacznie ułatwia życie użytkownikowi).

Opcja "tak" jest zaznaczona domyślnie, a wybór jest włączony. Jeśli użytkownik zaznaczy jeden z przycisków radiowych, wybór zostanie odpowiednio włączony lub wyłączony.

<form onclick="this.mySelect1.disabled = this.becomeMember[1].checked;" ... > 
    <input type="radio" name="becomeMember" checked>Yes<br> 
    <input type="radio" name="becomeMember">No<br> 

    <select id="mySelect1"> 
    <option>Dep1 
    <option>Dep2 
    <option>Dep3 
    <option>Dep4 
    </select> 
    ... 
</form>

Źródło

2012-03-30 01:05:38 RobG

hmm.dlaczego nie można używać onClick()

<select id="mySelect" onChange="enable();"> 
    <option onClick="disable();">No</option> 
    <option onClick="enable();">Yes</option> 
</select>

Źródło

2014-01-01 01:46:12 cargaraanorland

Wystarczy & proste: kod JavaScript:

function JoinedOrNot(){ 
    var cat = document.getElementById("mySelect"); 
    if(cat.value == "yes"){ 
     document.getElementById("mySelect1").disabled = false; 
    }else{ 
     document.getElementById("mySelect1").disabled = true; 
    } 
}

wystarczy dodać w tej linii [onChange = "JoinedOrNot()"]: <select id="mySelect" onchange="JoinedOrNot()">

to działa dobrze;)

Źródło

2014-11-23 01:48:58

onChange i onSelect w DropDownList

Odpowiedz

Powiązane problemy