Elementos que aparecen y desaparecen

tilu · #1 (**permalink**) 20/09/2005, 09:40

Necesito hacer un formulario interactivo de manera que dependiendo de un select, por ejemplo, aparezcan otros elementos del formulario.

En el índice de javascript existe un ejemplo: Elementos que aparecen y desaparecen, pero me gustaría evaluar otros más.

Agradecería cualquier aporte y/o link a páginas en Internet donde están implementados para tenerlos de ejemplos.

Gracias
Tilu

JavierB · #2 (**permalink**) 20/09/2005, 09:49

Hola tilu

Revisa este otro mensaje:

http://www.forosdelweb.com/f13/agregar-texboxs-254300/

Saludos,

tilu · #3 (**permalink**) 20/09/2005, 12:01

Hola JavierB

El mensaje que me das es ilustrador, pero me gustaría ver otras aplicaciones más, ojala haciendo uso de input desde un select.

JavierB · #4 (**permalink**) 20/09/2005, 12:14

Hola de nuevo.

Esplica un poco más que es lo que necesitas, seguro que conseguimos hacer algún apaño.

Saludos,

tilu · #5 (**permalink**) 20/09/2005, 12:29

Tengo un formulario que permite el llenado y/o modificación de datos de una base.

La cosa es que hay grupos de información de los cuales solo se ingresan algunos datos, por lo tanto mostrar todo el grupo haría un formulario (hoja de ingreso) muy extenso.

Entonces lo que quiero, en primera instancia (se reciben sugerencias), es dar en un select todos los datos del grupo de información y que la persona que digita seleccione los que necesite, así el formulario va creciendo según requerimientos.

Ejemplo: Grupo de Información = Universidades

<SELECT>
Dirección
Fono
Ciudad
Carreras
Director
</SELECT>

Si quiere ingresar la Dirección y Ciudad, que los escoja del SELECT y que aparezcan unicamente esos input.

De este modo se tienen varios grupos de Información y poner todos esos datos en un formulario lo harían eterno, por eso quiero compactarlo.

¿se entiende? ¿Rebuscado?

JavierB · #6 (**permalink**) 20/09/2005, 12:37

Rehola.

Te dejo un poco de código a ver si vamos avanzando:

Código PHP:

  <html> 
<head> 
<script type="text/javascript"> 
function anadir(frm,valor) { 
  txt = document.createTextNode(valor+': '); 
  frm.appendChild(txt); 
  ele = document.createElement('input'); 
  ele.name = valor; 
  frm.appendChild(ele); 
  ele = document.createElement('br');  
  frm.appendChild(ele); 
  frm.sel.options[frm.sel.selectedIndex] = null; 
} 
</script> 
</head> 
<body> 
<form> 
<select name="sel" onchange="anadir(this.form,this.value)"> 
<option value="Dirección">Dirección</option> 
<option value="Fono">Fono</option> 
<option value="Ciudad">Ciudad</option> 
<option value="Carreras">Carreras</option> 
<option value="Director">Director</option> 
</select> 
<br /> 
</form> 
</body> 
</html>

Salutres,

tilu · #7 (**permalink**) 20/09/2005, 13:11

Trabaja formidable !!

Ahora, y si no fuera mucha molestia

, queda por solucionar el tema de los componentes del input:

size
class
value (el más importante)

JavierB · #8 (**permalink**) 21/09/2005, 01:17

Sigamos...

ele.name = valor;
ele.size = '5';
ele.className = 'tuclase';
ele.value = 'valor';
frm.appendChild(ele);

Saludos,

tilu · #9 (**permalink**) 21/09/2005, 10:06

wow JavierB si que eres un encanto !!

Todo marcha muy bien... ahora para finalizar y hacerlo perfecto necesitaría una última indicación.

Necesito reconocer que opción llamó a la función para asignarle el valor del campo extraído de la base al value.

Lo he intentado con los if, pero no lo he conseguido exitosamente lo único que he conseguido es liarme.

Desde ya te estoy debiendo como unas mil gracias

JavierB · #10 (**permalink**) 21/09/2005, 12:23

Si te refieres al número de indice, lo averiguas con:

function anadir(frm,valor) {
indice = frm.sel.selectedIndex;

Saludos,

P.D. No me debes nada, con el

que me has puesto es suficiente.

tilu · #11 (**permalink**) 21/09/2005, 14:13

Si bien es cierto que no lo usé, si me sirvió para entender otras cosillas.

Hasta ahora todo marcha bien...

...aquí ya me acuso de abusadora, pero habrá forma de determinar en que parte de la pantalla aparezcan estos bichitos??

no me digas que solo con un

ya te conformas??

venga entonces todos estos para ti...

JavierB · #12 (**permalink**) 22/09/2005, 11:29

Me temo que esta vez me has pillado con la batería baja y no he entendido tu pregunta. ¿O será que tanto corazón me ha dejado

?

Saludos,

tilu · #13 (**permalink**) 23/09/2005, 14:18

A ver si me explico mejor...

...lo que quise decir es cómo controlar en que lugar de la hoja deben aparecer los campos creados dinámicamente.

Se entendió ahora?? sino, quito los corazones para que se entienda

JavierB · #14 (**permalink**) 24/09/2005, 02:29

Hola una vez más.

Fijate en esta línea: frm.appendChild(ele);

Eso indica que el elemento se va a añadir en el formulario. Pero si pones cualquier otra etiqueta con un id

<div id="algo"></div>

podrás cambiar esa línea por esta otra: document.getElementById('algo').appendChild(ele);

y lo añadirá dentro del bloque que tu quieras.

Espero que te sirva. Saludos,

tilu · #15 (**permalink**) 30/09/2005, 14:53

He vuelto para agradecer tu atención y ayuda brindada, de verdad que me ha servido mucho.

JavierB · #16 (**permalink**) 01/10/2005, 02:42

Me alegro de que te haya resultado útil mi ayuda. Hasta pronto