check box que abre mas opciones

fedexx · #1 (**permalink**) 07/08/2005, 23:15

Hola estoy buscando algo que creo que es simple pero no logro hacerlo ni encontrar ningun ejemplo por ningun lado, estoy tratando de hacer un checkbox que al tildarlo me aparezcan mas opciones debajo para poder llenar ona especie de "te gustaria seguir poniendo opciones" si el user le chekea esa opcion le aparecen unos textareas y unos textimputs para poner mas datos.

Ha y otra cosa que me estaba olvidando, resulta que tengo un formulario de modificacion de datos de los usuarios y dentro de el tengo un formulario para el envio de un avatar, la cosa es que no funcionan los dos juntos como puedo hacer para que funcionen los dos alk mismo tiempo aunque uno este dentro del otro es decir que funcionen por separado.
aver seria algo asi

<Form>
opciones
<Form>
subir avatar
</form> //cierra el formulario del avatar
</form> // cierra el formulario de las opciones que comenzaron arriba

Espero haber sido claro .. creo que me complique demasiado... disculpas

Bueno gente saludos
Y mil gracias

TheWolF · #2 (**permalink**) 08/08/2005, 00:52

a ver si esto te vale... es una función que te agrega un objeto de formulario más, se puede adaptar para tus necesidades :)

Código:

function validar(){
	if(document.NombreForm.NombreCheck.checked==true)
    {
        alert("Traza: \n" + "id: " + id + "\n" + "Documento: " + document.getElementById('Documento'));
        var campo=document.createElement("INPUT");
        campo.setAttribute("type","text");
        campo.setAttribute("name","Documento");
        campo.setAttribute("id","Documento");
        campo.setAttribute("value","El contenido");
        document.getElementsByName("filtro")[0].appendChild(campo);
        alert("Creo el Campo")
    }
    else
    {
	    hijo=document.getElementById("Documento");
	    padre=hijo.parentNode;
	    padre.removeChild(hijo);
	    alert(id + " Elimino el campo Documento");
    }
}

Un saludo.

fedexx · #3 (**permalink**) 08/08/2005, 22:10

Hola the wolf , parece bueno pero no se como implementarlo hice algo asi

<html>

<head>
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Pagina nueva 1</title>

<script type="text/javascript">
function validar(){
if(document.formulario.C1.checked==true)
{
alert("Traza: \n" + "id: " + id + "\n" + "Documento: " + document.getElementById('Documento'));
var campo=document.createElement("INPUT");
campo.setAttribute("type","text");
campo.setAttribute("name","Documento");
campo.setAttribute("id","Documento");
campo.setAttribute("value","El contenido");
document.getElementsByName("filtro")[0].appendChild(campo);
alert("Creo el Campo")
}
else
{
hijo=document.getElementById("Documento");
padre=hijo.parentNode;
padre.removeChild(hijo);
alert(id + " Elimino el campo Documento");
}
}
</script>
</head>

<body>

<form method="POST" action="--WEBBOT-SELF--" name="formulario">
<input type="checkbox" name="C1" value="ON"><input type="submit" value="Enviar" name="B1"><input type="reset" value="Restablecer" name="B2"></p>
</form>

pero no parece estar bien porque no funciona que le falta ? :(

fedexx · #4 (**permalink**) 08/08/2005, 22:42

mmmm creo que ya se lo que estoy buscando, solo presiso un check box que muestre u oculte un layer y asi oculto omuestro mas info :D la cosa es que no se como hacerlo :( alguna idea ?

jam1138 · #5 (**permalink**) 09/08/2005, 00:48

Código HTML:

Mostrar: <input type="checkbox" onClick=" document.getElementById('opciones').style.display= this.checked?'':'none'">

<div id="opciones" style="display:none">
>>> Layer <<<<br><input type="text"><br>
<textarea></textarea>
</div>

fedexx · #6 (**permalink**) 09/08/2005, 07:31

jam1138 MIL GRACIAS loko exactamente lo que queria de enserio muchisimas gracias por tu ayuda :)

fedexx · #7 (**permalink**) 09/08/2005, 09:00

Hums .. ahora me surgio un nuevo problema :( tengo ke lograr esconder dos

Código HTML:

<TR> juntos para uno me sale sin problemas seria algo asi 

    <tr id="opciones" style="display:{$layer}">

        <td> blabla </td>
</tr>

pero para ocultar dos ? osea seria algo asi

Código HTML:

<tr>

        <td> primer fila que neseesito ocultar </td>
</tr>
   <tr>

        <td> segunda fila que neseesito ocultar </td>
</tr>

Saludos y gracias :D

jam1138 · #8 (**permalink**) 11/08/2005, 02:53

Pués si tus filas están seguidas, la manera simple sería anidar tablas de manera que estás dos filas sean una tabla (ó estén contenidas en una fila...) y ocultar este objeto.

Pero esto no es aplicable si las filas serán salteadas...

puedes colocarles id's numéricas y ocupar un ciclo para ocultarlas todas.

Ejemplo:

Código HTML:

<html><head>
<script>
function mostrar(reb) {
for(i=1; i<3; i++) 
      document.getElementById(i).style.display= reb.checked?'':'none';
}
</script>
</head><body>
<table><tr><td>Mostrar: <input type="checkbox" onClick="mostrar(this)"> </td></tr>
<tr id="1"><td>Fila 1 (ocultar)</td></tr>
<tr><td>Fila 2 (visible)</td></tr>
<tr id="2"><td> Fila 3 (ocultar)</td></tr>
</table></body></html>