bloquear un option's?

zyon · #1 (**permalink**) 13/07/2007, 08:30

Que tal, hay alguna manera de que en un select, a ciertos option's se puedan bloquear ? que si se seleccionan no tome ese valor el select?

Gracias de antemano!

Kaopectate · #2 (**permalink**) 13/07/2007, 17:37

Hola zyon.

No se si es exactamente lo que necesitas, pero aqui te pongo un ejemplo:

Código PHP:

  <html> 
 <head> 
  <script language='JavaScript'> 
 
   function valida(oSel){ 
    if (oSel.value == '-') 
     oSel.selectedIndex = 0; 
   } 
 
  </script>   
 </head> 
 <body> 
  <form name='frm'> 
   <select name='sel' onchange='valida(this)'> 
    <option value='' selected></option> 
    <option value='A'>Letra "A"</option> 
    <option value='B'>Letra "B"</option> 
    <option value='-'>---------</option> 
    <option value='C'>Letra "C"</option> 
    <option value='D'>Letra "D"</option> 
   </select> 
  </form> 
 </body> 
</html>

Saludos.

alexserver · #3 (**permalink**) 13/07/2007, 23:53

cuando construyas el select, a la opcion que quieras bloquear ponle un disabled:

Código HTML:

<select name="ss" >
  <option value="01" disabled>One</option>
  <option value="02" >Two</option>
  <option value="03" >Three</option>
</select>

la opcion uno aparecera como deshabilitada, esto solo funciona en firefox... lo que puedes hacer para que funcione en IE es anteponerle una expresion al valor y preguntar si esa expresion ha sido encontrada... seleccionar otro elemento

Código HTML:

<select name="ss" id="ss" >
  <option value="disabled_01" disabled>One</option>
  <option value="02" >Two</option>
  <option value="03" >Three</option>
</select>

document.getElementById("ss").onchange = function(e) {
  if (this.options[this.selectedIndex].value.indexOf("disabled_") == 0) {
       //la encontro
       this.selectedIndex = 0;
  }
};

Panino5001 · #4 (**permalink**) 14/07/2007, 00:38

También tenés el tag optgroup, que sirve para agrupar conjuntos de options:

Código PHP:

  <form id="form1" name="form1" method="post" action=""> 
  <select> 
<optgroup label="nop"> 
<option value ="aaa">aaa</option> 
<option value ="bbb">bbb</option> 
</optgroup> 
<optgroup label="tampoco"> 
<option value ="ccc">ccc</option> 
<option value ="ddd">ddd</option> 
</optgroup> 
</select> 
</form>

derkenuke · #5 (**permalink**) 15/07/2007, 20:32

Sólo un apunte alexserver:
El atributo disabled correctamente tendría que tener valor, por ejemplo:
disabled="disabled"

Para que sea todo más legible y no tener que modificar código HTML podemos usar algún script que hay por la red para que el atributo disabled funcione en IE

. Alguna vez he usado alguno y no hubo problema.

Un saludo.

zyon · #6 (**permalink**) 16/07/2007, 13:25

Gracias a todos por su repsuesta, lo checare, Gracias!

zyon · #7 (**permalink**) 17/07/2007, 14:29

Que tal Derkenuke, creo no entendibien, dices que para que la propiedad disabled="disabled" funciona hay que implementar otra funcion de JS? por que lo probe y no hace nada jeje

zyon · #8 (**permalink**) 17/07/2007, 14:37

por cierto, a alexserver, no entiendo como mandar a llamar el pedacito de script que mencionas :S

derkenuke · #9 (**permalink**) 17/07/2007, 15:17

Hola zyon, me refería que para que fuese xhtml válido todas las etiquetas deben ir cerradas, o las que no tienen cierre con su cierre en la misma etiqueta de apertura:

Código:

<br> --> <br />
<input> -->  <input />
<input disabled> -->  <input disabled="disabled" />

De esta manera los atributos deben ir entrecomillados tengan el valor que tengan, y siempre tener valor (sobre todo para los de selected, checked y en este caso disabled).

Fíjate en el apartado 4: Diferencias con HTML 4.0, de la traducción de la especificacion XHTML 1.0. Ahí tienes las principales diferencias para escribir un documento más estándar actualmente.

Un saludo.

alexserver · #10 (**permalink**) 17/07/2007, 23:53

el codigo javascrip que puse es una asignacion de evento al objeto select.
lo puedes poner en una funcion, y llamar esa funcion en el evento onload de la pagina, ya sea mendiante javascript con
window.onload
o en el body
<body onload="function()">

zyon · #11 (**permalink**) 24/07/2007, 15:34

no he tenido oportunidad de terminar esta validacion por otras cosas, pero en cuanto pueda espero le den su seguimiento por si se me atora algo :P jejeje