Foros del Web - creación dinámica de formularios (explorer)

Foros del Web (http://www.forosdelweb.com/)

- Javascript (http://www.forosdelweb.com/f13/)

- - creación dinámica de formularios (explorer) (http://www.forosdelweb.com/f13/creacion-dinamica-formularios-explorer-419823/)

caricatos

24/08/2006 08:30

creación dinámica de formularios (explorer)

Hola:

Para ir al grano voy a poner el código que crea un formulario y que en explorer no funciona:

Código:

<html>

<head>

<script type="text/javascript">

function nF() {

 f = document.createElement("form");

 i = document.createElement("input");

 b = document.createElement("button");

 i.setAttribute("type", "text");

 b.setAttribute("type", "button");

 b.appendChild(document.createTextNode("prueba"));

 i.setAttribute("name", "xx");

 f.setAttribute("name", "f");

 if (document.all) b.attachEvent("onclick", hola);

 else b.addEventListener("click", hola, true);

 f.appendChild(i);

 f.appendChild(b);

 document.body.appendChild(f);

}
 

function hola(e) {

 if (document.all)

  alert(event.srcElement.form.xx.value);

 else

  alert(e.target.form.xx.value);

}
 

</script>

</head>

<body onload="nF()">

</body>

</html>

Un botón debería mostrar una alerta con el texto introducido en un campo de texto... va bien en opera y firefox pero no cuela en explorer... y creo que es código correcto.

Gracias :arriba:

Cap.Buscapina

24/08/2006 16:33

parece que adicionandole "document" previo a la llamada al form está el 50% de la solucion.

El otro 50% es que parece que IE asigna el nombre dinamicamente, pero solo lo puedes llamar por el índice

Cita:

<html>
<head>
<script type="text/javascript">
function nF() {
f = document.createElement("form");
i = document.createElement("input");
b = document.createElement("button");
i.setAttribute("type", "text");
b.setAttribute("type", "button");
b.appendChild(document.createTextNode("prueba"));
i.setAttribute("name", "xx");
f.setAttribute("name", "f");
if (document.all) b.attachEvent("onclick", hola);
else b.addEventListener("click", hola, true);
f.appendChild(i);
f.appendChild(b);
document.body.appendChild(f);
}
function hola(e) {
if (document.all)
alert(event.srcElement.document.forms[0][0].value);
else
alert(e.target.form.xx.value);
}

</script>
</head>
<body onload="nF()">
</body>
</html>

no se bien a que apunta este codigo por lo que no se si esta es la solucion integral. Tiene algo que ver con frames o popup?

saludos

PD: la linea verde sobra (creo).

caricatos

24/08/2006 20:10

Hola Capi:

Sobre la línea verde: tipo de botón por defecto, en explorer se crean los botones con el tipo button y en FF y opera con submit así que me parece que está bien puesto...

Y la indexación no me vale (no lo había considerado, pero para mis propósitos...)

Verás, el script donde lo uso está en esta página: Fechas... el calendario de pie de página no funciona con este sistema... el del principio sí, pero el formulario se crea con document.write... ¡otro caso polstergate (o como se escriba)!

Saludos :arriba:

Cap.Buscapina

25/08/2006 10:08

creo que ahora si

el problema parece ser los name's y los id's en IE.

teniendo como base el código del calendario que publicas en tu pagina , solamente le tenés que agregar el atributo "id" a cada elemento del form (y el form inclusive).

sería así:

Cita:

.....
var _calendario = document.createElement("form");
_calendario.name = el_id;
_calendario.id = el_id;

.....
_control = document.createElement("select");
_control.setAttribute("id", "mes");
_control.setAttribute("name", "mes");

.....

_control.name = "aaaa";
_control.id = "aaaa";

No pongo todo el codigo porque no creo que haga falta ya que con solo esos cambios funcionaria en IE.

saludos

Cap.Buscapina

25/08/2006 10:11

creo que ahora si

<editando>
disculpas, se repitio el mismo mensaje
</editando>

caricatos

25/08/2006 10:34

Hola Capi, gracias:

Verás, no estoy en la máquina del código, y tengo el tiempo un poco escaso, pero en cuanto pueda lo pruebo y te cuento...

Saludos :arriba:

caricatos

26/08/2006 08:27

Hola:

Comprobado. Ya he modificado el script, aunque el id se duplicaba porque lo usaba en la tabla... pero lo quité de la tabla y no ha cambiado el aspecto, así que me vale.

Lo miraré con más detenimiento y pondré los créditos.

Muchas gracias, Capi.

Saludos :arriba:

Cap.Buscapina

26/08/2006 09:44

de nada, mi estimado

ha sido un placer.:arriba:

saludos:adios:

Panino5001

26/08/2006 13:01

consulta

Hola, Caricatos, Hola Capi!
No tengo conocimientos acerca de asignar eventos de esta manera y pregunto para aprender solamente. Es decir, con mis preguntas no estoy afirmando nada porque, repito, estoy iniciándome en los eventos del DOM y necesito que me orienten un poco a ver si estoy entendiendo o estoy totalmente confundido (incluso les agradecería lgún link para seguir aprendiendo):
En esta función:

Código:

function hola(e) {

if (document.all)

alert(event.srcElement.document.forms[0][0].value);

else

alert(e.target.form.xx.value);

}

Porqué es necesario utilizar event.srcElement o e.target?
srcElement y target no indican el nodo que generó el evento? Es por el burbujeo que hace que el valor de e.target y event.srcElement terminen convirtiéndose en document? Y en ese caso no conviene detener el burbujeo o simplemente llamar al alert con este argumento en ambos navegadores: document.forms[0][0].value

caricatos

26/08/2006 20:16

Hola Panino5001:

La razón de usar e.target y event.srcElement se debe a que para poner un manejador de eventos con el DOM hay que hacerlo con los métodos attachEvent y addEventListener (para explorer y mozilla + navegadores estándar respectivamente)... y mediante esa técnica no se pueden pasar parámetros; por ejemplo, pudiendo usar como parámetro el objeto this es fácil obtener el formulario de donde depende el botón que hemos creado dinámicamente, pero al no poder usar parámetros obtenemos el elemento donde se produjo el evento de esa manera.

Sobre el burbujeo, creo que en este caso no debería haber (pero es un tema que no controlo)

Saludos :arriba:

Panino5001

26/08/2006 21:46

Gracias, Caricatos, queda claro. Un abrazo, Andrés

La zona horaria es GMT -6. Ahora son las 11:45.