onChange y onSelect en DropDownList

que tienen un DropDownList que pregunta al usuario si quiere unirse al club:onChange y onSelect en DropDownList

Do you want to join the club 
Yes 
No

En esta lista hay otra lista que se establece en desactivada por defecto. Esta lista tiene los departamentos del club. Esta lista no se habilitará hasta que el usuario elija Sí.

Creé el siguiente código pero el problema que no pude resolver es supongamos que el usuario elige Sí, entonces cambia su decisión para que elija No nuevamente. En este caso, la lista de los departamentos sigue habilitada. Quiero que se deshabilite cuando elige No nuevamente.

<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>

pensé que onSelect="disable();" resolvería el problema, pero todavía no funciona.

Gracias

Fuente

2012-03-29 Nasser

Parece que los botones de radio serían mucho más adecuados. Además, 'onselect' no es un atributo válido para los elementos de selección y opción. – RobG

lo haría como esto 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>

Fuente

2012-03-29 23:53:10 j08691

apuesto a la onchange se ser despedido después de la onselect, esencialmente volver a habilitar la selección.

Recomendaría implementar soloonchange, inspeccionar qué opción se ha seleccionado y activar o desactivar en función de eso.

para obtener el valor de la opción seleccionada uso:

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

que producirá .. nada ya que no se ha especificado un valor para cada opción .. :(

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

Ahora cederá "yes" o "no"

Fuente

2012-03-29 23:39:22 Halcyon

Para hacer una forma sólida, tiene que cargar en una secuencia de comandos de estado y el uso útil para mejorar su comportamiento. A continuación, la selección ha sido reemplazada por botones de opción (hace que la vida sea mucho más fácil para el usuario).

La opción "sí" está marcada por defecto y la selección está habilitada. Si el usuario marca cualquiera de los botones de opción, la selección se habilita o deshabilita en consecuencia.

<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>

Fuente

2012-03-30 01:05:38 RobG

hmm.¿por qué no utilizar onClick()

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

Fuente

2014-01-01 01:46:12 cargaraanorland

Simplemente & Fácil: código JavaScript:

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

sólo tiene que añadir en esta línea [onchange = "JoinedOrNot()"]: <select id="mySelect" onchange="JoinedOrNot()">

Es funciona bien;)

Fuente

2014-11-23 01:48:58

onChange y onSelect en DropDownList

Respuesta

Cuestiones relacionadas