habilitar un texto segun radiobubtton

xias · #1 (**permalink**) 23/12/2002, 07:59

hola:

he cogido de las faq´s un ejemplo sobre lo del titulo, pero en mi caso solo hay 2 radio button y no consigo q me funcione. Este es mi codigo:

<html>
<head>
<title>Untitled Document</title>

<script language="JavaScript">

function habilita(){
document.frm.txt.disabled = false;
}

function deshabilita(){
document.frm.txt.disabled = true;
document.frm.txt.value = "";
}

</script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>
<form>
<input type="radio" name="conectado" value="si" onclick="deshabilita()">
Sí
<input type="radio" name="conectado" value="no" onclick="habilita()">
No (indique cual:
<input type="text" name="txt" disabled> )</td>
</tr>
</form>
</body>
</html>

me podeis echar una mano?

un saludo

gracias

KarlanKas · #2 (**permalink**) 23/12/2002, 08:09

Le faltaba un poquito!!

Sólo tenías que poner un nombre al formulario.

El código resultante es el siguiente:

Código:

<html>
<head>
<title>Untitled Document</title>

<script language="JavaScript">

function habilita(){
document.formulario.txt.disabled = false;
}

function deshabilita(){
formulario.txt.disabled = true;
document.formulario.txt.value = "";
}


</script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>
<form name="formulario">
<input type="radio" name="conectado" value="si" onclick="deshabilita()">
Sí 
<input type="radio" name="conectado" value="no" onclick="habilita()">
No (indique cual:
<input type="text" name="txt" disabled> )</td>
</tr>
</form>
</body>
</html>

xias · #3 (**permalink**) 23/12/2002, 08:13

ok, no me habis dado cuenta que utilizaba el nombre del formulario.

un saludo

gracias

KarlanKas · #4 (**permalink**) 23/12/2002, 08:30

¿Y no sería mejor con un checkbox?

Código:

<html>
<head>
<title>Untitled Document</title>
<style>
body,TD,INPUT{font:bold 10px/12px verdana;color:black;}
#txt{border:solid 1px black;width:200px;}
</style>
<script language="JavaScript">


function deshabilita(opcion){
if (opcion.checked){
document.formulario.txt.value = "";
document.formulario.txt.style.background = "#e0e0e0";
document.formulario.txt.disabled = true;

}
else{formulario.txt.disabled = false;
document.formulario.txt.style.background = "#ffffff";
}}


</script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>
<table><tr>
<form name="formulario">
<td>
<input type="text" id="txt" name="txt" ></td></tr>
<tr>
<td>
<input type="checkbox" name="conectado" onchange="deshabilita(this)">Deshabilitado</td>
</tr>
</form>
</table>
</body>
</html>

kayserpc · #5 (**permalink**) 02/09/2008, 13:26

KarlanKas, sos de lo mas groso. Vi este ejemplo y casi me solucionas la vida, eso si, yo te tengo que joder un rato mas. Estoy muerto en java y necesito hacer algo similar pero el tema es que en vez de deshabilitar un texto tengo que deshabilitar 3, como hago para hacerlo general y no tener un codigo repetitivo. Yo ahora lo tengo asi:

<script language="javascript" type="text/javascript">
function habilita(){
document.formulario.p6_2.disabled = false;
document.formulario.p6_3.disabled = false;
document.formulario.p6_4.disabled = false;
}

function deshabilita(){
document.formulario.p6_2.disabled = true;
document.formulario.p6_3.disabled = true;
document.formulario.p6_4.disabled = true;
}

</script>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>
<form name="formulario" id="formulario" action="default.asp" method="post"onsubmit="validar_form(document.formu lario)">

<input name="p6_1" type="radio" value="1" onclick="habilita()"/>
<input name="p6_1" type="radio" value="0"onclick="deshabilita()"/>

<input name="p6_2" type="text" class="forms" size="20">
<input name="p6_3" type="text" class="forms" size="20">
<input name="p6_4" type="text" class="forms" size="20">

</form>
</body>
</html>

el tema es que quisiera tener menos de 3 instrucciones por cada vez que quiera hacer eso porque es una encuesta y tengo que hacer lo mismo varias veces

gracias, miles de ellas

David · #6 (**permalink**) 02/09/2008, 13:33

Lo que puedes hacer es que los input sean un arreglo, y para habilitarlos o deshabilitarlos solo recorrer ese arreglo.

KarlanKas · #7 (**permalink**) 03/09/2008, 00:23

Puedes probar así:

Código PHP:

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Documento sin t&iacute;tulo</title> 
<script> 
function inicio(){ 
    inputs=document.getElementsByTagName("INPUT"); 
    for(a=0;a<inputs.length;a++){ 
        if(inputs[a].type=="radio"){ 
            inputs[a].setAttribute("onclick", 'habilitar(this)'); 
            inputs[a].onclick=function(){habilitar(this)};  
 
        } 
     
    } 
 
} 
 
function habilitar(esto){ 
nombre=esto.name.split("_")[0]; 
 
deshabilitado=(esto.value==0); 
for(a=0;a<inputs.length;a++){ 
if(inputs[a].type=="text" && inputs[a].name.indexOf(nombre)!=-1){ 
inputs[a].disabled=deshabilitado; 
} 
} 
} 
window.onload=inicio; 
</script> 
</head> 
 
<body> 
<form action="#"> 
<input name="p6_1" type="radio" value="1" /> 
<input name="p6_1" type="radio" value="0" /> 
 
<input name="p6_2" type="text" class="forms" size="20"> 
<input name="p6_3" type="text" class="forms" size="20"> 
<input name="p6_4" type="text" class="forms" size="20"> 
<br /> 
<br /> 
<input name="p5_1" type="radio" value="1" /> 
<input name="p5_1" type="radio" value="0" /> 
 
<input name="p5_2" type="text" class="forms" size="20"> 
<input name="p5_3" type="text" class="forms" size="20"> 
<input name="p5_4" type="text" class="forms" size="20"> 
 
<br /> 
<br /> 
<input name="p4_1" type="radio" value="1" /> 
<input name="p4_1" type="radio" value="0" /> 
 
<input name="p4_2" type="text" class="forms" size="20"> 
<input name="p4_3" type="text" class="forms" size="20"> 
<input name="p4_4" type="text" class="forms" size="20"> 
 
 
</form> 
</body> 
</html>

Aquí lo importante es poner el script del principio y ya está. Siempre y cuando respetes la lógica de los name de los inputs. No tienes que añadir ningún onclick ni nada. Sólo añadir el script al principio de la página y ya está.

Espero que te sirva!