Disable y Enable con boton radio

hanscruz · #1 (**permalink**) 18/01/2006, 13:54

Primero decirles que poco entiendo de javascript, buscando encontre unos ejemplos en las librerias de lo que quiero pero no puedo adaptarlos (no se mucho de esto) pero lo que quiero hacer es lo siguiente:

En un formulario tengo dos radio butons uno con un select y otro con inputs tipo files, lo que quiero es que cuando seleccione de los radios se habilite el que le corresponda por ejemplo: si elijiera el radio1 este habilitado el select para escojer y los campos imputs files este desabilitados, y que cuando el radio 2 se seleccione el select se inabilite y se habilite los imputs files. etc.

Espero haberme explicado
Saludos a todos.

jerkan · #2 (**permalink**) 18/01/2006, 14:13

Si el radiobutton se llama 'radio' entonces simplemente tienes que hacer lo siguiente:

document.Formulario.NombreCampo.disabled = !document.Formulario.radio.checked

esteno · #3 (**permalink**) 18/01/2006, 14:42

Hola hanscruz,

Veo que tienes ganas de empezar con jacascript

Te pongo un ejemplo sencillo de lo que pides para que puedas ir trasteando:

Código PHP:

  <html> 
<head> 
<script language="javascript" type="text/javascript"> 
 
function cambiaRadio() 
{ 
  if(document.form.radio[0].checked) 
  { 
    document.getElementById('opcion2').style.display = 'none'; 
    document.getElementById('opcion1').style.display = 'block'; 
  } 
  else if(document.form.radio[1].checked) 
  { 
    document.getElementById('opcion1').style.display = 'none'; 
    document.getElementById('opcion2').style.display = 'block'; 
  } 
} 
 
</script> 
</head> 
<body> 
 
<form action="" name="form"> 
 
<input type="radio" name="radio" value="1" onClick="cambiaRadio();" /> Opción 1 
<input type="radio" name="radio" value="2" onClick="cambiaRadio();" /> Opción 2 
 
<div id="opcion1" style="display: none;"> 
<input type="text" name="opcion1_campo1" /> 
</div> 
 
<div id="opcion2" style="display: none;"> 
<select name="opcion1_campo1"> 
<option value="1">Valor 1</option> 
</select> 
</div> 
 
<input type="submit" name="enviar" value="Enviar..." /> 
 
</form> 
 
</body> 
</html>

Saludos