Hola a todos!
Les aclaro que se muy poco de JS y estoy aprendiendo de apoco así que
agradezco mucho a todos los que me ayuden con este problema y a los que me
prestan sus ayudas y solución.
Tengo un formulario que tiene algunos input tipo text, estos solo se deben
mostrar si se hace clic en el checkbox que tiene al lado.
Tengo un código que funciona pero solamente para un solo input. Y necesito
que se pueda usar para varios.
Este es el código.
/* formexp.js */
var
xOp7Up,xOp6Dn,xIE4Up,xIE4,xIE5,xNN4,xUA=navigator.userAgent.toLowerCase();if(window.opera){var
i=xUA.indexOf('opera');if(i!=-1){var
v=parseInt(xUA.charAt(i+6));xOp7Up=v>=7;xOp6Dn=v<7;}}else
if(navigator.vendor!='KDE' && document.all &&
xUA.indexOf('msie')!=-1){xIE4Up=parseFloat(navigator.appVersion)>=4;xIE4=xUA.indexOf('msie
4')!=-1;xIE5=xUA.indexOf('msie 5')!=-1;}else
if(document.layers){xNN4=true;}xMac=xUA.indexOf('mac')!=-1;function
xDef(){for(var i=0; i<arguments.length;
++i){if(typeof(arguments[i])=='undefined') return false;}return true;}function
xDisplay(e,s){if(!(e=xGetElementById(e))) return null;if(e.style &&
xDef(e.style.display)) {if (xStr(s)) e.style.display = s;return
e.style.display;}return null;}function
xGetElementById(e){if(typeof(e)!='string') return e;if(document.getElementById)
e=document.getElementById(e);else if(document.all) e=document.all[e];else
e=null;return e;}function xStr(s){for(var i=0; i<arguments.length;
++i){if(typeof(arguments[i])!='string') return false;}return true;}
HTML formulario
<html>
<head>
<title>Expandir formulario</title>
<script type='text/javascript' src='formexp.js'></script>
<script>
function expandir_formulario(){
if (document.f1.expandir.checked){
xDisplay('capaexpansion', 'block')
}else{
xDisplay('capaexpansion', 'none')
}
}
</script>
<style type="text/css">
#capainicio{
position:relative;
}
#capaexpansion{
position:relative;
display:none;
}
#capafinal{
position:relative;
}
</style>
</head>
<body>
<form name=f1>
<div id=capainicio>
<table cellspacing="2" cellpadding="2" border="0">
<tr>
<td width=140>Nombre:</td>
<td><input type="text" name="nombre" size="25"></td>
</tr>
<tr>
<td>Apellidos:</td>
<td><input type="text" name="edad" size="3"></td>
</tr>
<tr>
<td>Expandir formulario:</td>
<td><input type="checkbox" name="expandir" value="1"
onclick="expandir_formulario()"></td>
</tr>
</table>
</div>
<div id=capaexpansion>
<table cellspacing="2" cellpadding="2" border="0">
<tr>
<td width=140>Sexo:</td>
<td><input type="text" name="sexo" size="25"></td>
</tr>
<tr>
<td>Edad:</td>
<td><input type="text" name="edad" size="3"></td>
</tr>
</table>
</div>
<div id=capafinal>
<table cellspacing="2" cellpadding="2" border="0">
<tr>
<td width=140>Comentarios:</td>
<td><textarea cols="39" rows="4" name="coment"></textarea></td>
</tr>
</table>
</div>
</form>
</body>
</html>
Todo esto funciona bien.
Y esto es lo que no puedo hacer funcionar.
<html>
<head>
<title>Expandir formulario</title>
<script type='text/javascript' src='formexp.js'></script>
<script>
function expandir_formulario(){
if (document.f1.expandir.checked){
xDisplay('capaexpansion', 'block')
}else{
xDisplay('capaexpansion', 'none')
}
}
</script>
<style type="text/css">
#capainicio{
position:relative;
}
#capaexpansion{
position:relative;
display:none;
}
#capafinal{
position:relative;
}
</style>
</head>
<body>
<form name=f1>
Expandir formulario:
<input type="checkbox" name="expandir" value="1"
onclick="expandir_formulario()">
<div id=capaexpansion>
<table cellspacing="2" cellpadding="2" border="0">
<tr>
<td width=140>Sexo:</td>
<td><input type="text" name="sexo" size="25"></td>
</tr>
</table>
</div>
<br>
Expandir formulario 2:
<input type="checkbox" name="expandir2" value="2"
onclick="expandir_formulario()">
<div id=capaexpansion2>
<table cellspacing="2" cellpadding="2" border="0">
<tr>
<td width=140>Sexo:</td>
<td><input type="text" name="sexo" size="25"></td>
</tr>
</table>
</div>
</form>
</body>
</html>
Espero que me puedan ayudar, o si tienen ya un codigo que funcione espero que
me lo envien.
Muchas Gracias
Walter
---------------------------------
Preguntá. Respondé. Descubrí.
Todo lo que querías saber, y lo que ni imaginabas,
está en Yahoo! Respuestas (Beta).
Probalo ya!
------------ próxima parte ------------
Se ha borrado un adjunto en formato HTML...
URL:
http://lists.scriptia.net/pipermail/javaescript-scriptia.net/attachments/20070201/cee8071e/attachment.htm
_______________________________________________
javaEScript mailing list
[email protected]
http://lists.scriptia.net/listinfo.cgi/javaescript-scriptia.net