25/03/2008, 09:04
|
| | Fecha de Ingreso: marzo-2008
Mensajes: 21
Antigüedad: 16 años, 9 meses Puntos: 1 | |
Re: Crear Formulario dinámico Hola PAQUEDO!
Creo haber entendido tu problema y tiene una muy sencilla solución, te explico paso a paso:
1.- Crea un único fomulario.
<form name='ejemplo'>
</form>
2.- Dentro de este fomulario vas a colocar una tabla para cada sección que deberá ir apareciendo:
<form name='ejemplo'>
//Sección 1
<table>
<tr>
<select name='ejmplo'>
<option value=1>ejemplo1</option>
<option value=1>ejmeplo2</option>
</select>
</tr>
</table>
//Sección 2
<table>
<tr>
<select name='signo'>
<option value=1>aries</option>
<option value=1>tauro</option>
</select>
</tr>
</table>
//Sección 3
<table>
<tr>
<input name='hobbie' type='text'>
</tr>
</table>
</form>
3.- Cada sección la dividimos en bloques 'DIV' así:
<form name='ejemplo'>
//Sección 1
<div id='bloque1'>
<table>
<tr>
<select name='ejmplo'>
<option value=1>ejemplo1</option>
<option value=1>ejmeplo2</option>
</select>
</tr>
</table>
</div>
//Sección 2
<div id='bloque2'>
<table>
<tr>
<select name='signo'>
<option value=1>aries</option>
<option value=1>tauro</option>
</select>
</tr>
</table>
</div>
//Sección 3
<div id='bloque3'>
<table>
<tr>
<input name='hobbie' type='text'>
</tr>
</table>
</div>
</form>
4.- Hasta este punto vamos a ver todo las dos listas yla caja de texto, pero ahora es donde va a pasar lo que quieres.
Necesitamos que dependiendo de la selección de cada una de las listas pase algo, llamemos a esa función 'mostrar_siguiente(x)', donde x es el valor seleccionado en ese momento. Ejemplo:
<form name='ejemplo'>
//Sección 1
<div id='bloque1'>
<table>
<tr>
<select name='ejmplo'>
<option value=1 onclik='mostra_siguiente("1");'>
ejemplo1</option>
<option value=2 onclik='mostra_siguiente("2");'>
ejmeplo2</option>
</select>
</tr>
</table>
</div>
//Sección 2
<div id='bloque2'>
<table>
<tr>
<select name='signo'>
<option value=1>aries</option>
<option value=2>tauro</option>
</select>
</tr>
</table>
</div>
//Sección 3
<div id='bloque3'>
<table>
<tr>
<input name='hobbie' type='text'>
</tr>
</table>
</div>
5.- DEfinimos la función:
<script>
function mostrar-siguiente(x){
if (x==1){
document.getElementById("bloque_2").style.display= " ";
}
if (x==2){
document.getElementById("bloque_3").style.display= " ";
}
}
</script>
Esta función muestra el bloque 2 o 3 dependiendo de la selección.
lo colocas en el <head></head> si tienes html +php pero, si tienes solo php colocalo simplemente al inicio del archivo .
Hasta ahora seguramente no verás el efecto que quieres y esto es porque deseas que se vea bloque 1 y dependiendo de lo que selecciones el bloque 2 ó 3 y así sucesivamente...
Esto lo lograrás ocultando todos los bloques a excepción del inicial.
5.- Forma de ocultar todos los bloques menos el primero:
<script>
document.getElementById("bloque_2").style.display= " none";
document.getElementById("bloque_3").style.display= " none";
</script>
este estracto de código lo vas a colocar al final de tu código php, ejemplo:
<?php>
'tu código';
<?>
<script>
document.getElementById("bloque_2").style.display= " none";
document.getElementById("bloque_3").style.display= " none";
</script>
Eso es todo ....espero que te sirva!!!! |