Duplicar tabla desde funcion.

chefnelone · #1 (**permalink**) 23/03/2006, 06:47

hola a todos

Es posible que una funcion duplique una tabla en mi pagina.
Supongamos que tengo una sola tabla en el comienzo de la pagina y con esa funcion hacer que aparezca una "exactamente igual" debajo.
Yo lo estoy haciendo creando las tablas como OCULTAS y luego lo que hago es DESOCULTARLAS pero mi problema es que el archivo se hace demasiado grande (400 kb). Así que estoy buscando otra opcion para que las tablas se creen cuando el usuario las necesita (y sino que no se creen)
Espero haberme hecho entender.

saludos
gracias

chefnelone · #2 (**permalink**) 23/03/2006, 16:25

Hola
he encontrado este codigo y me funciona y lo entiendo para adaptarlo a mi pagina. Pero el problema es que cuando crea la tabla quita todo lo que habia en la pagina (absolutamente todo, inclusive el boton con el ejecuto la accion)
¿¿ Como hago para que la cree debajo del boton??

CODE

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>
<script>
function ACCION()
{
document.write ("<table border='2'><tr><td>texto </td><td>texto</td></tr></table><table border='2'><tr><td>texto </td><td>texto</td></tr></table>");
}

</script>
<input type="button" name="Button" value="Button" onClick="ACCION()">
</body>
</html>

uamistad · #3 (**permalink**) 23/03/2006, 16:37

Se me ocurre que mejor podrías escribir en un DIV, ejemplo aquí.

Código HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>
<script>
function ACCION()
{
document.getElementById("escribeAqui").innerHTML = "<table border='2'><tr><td>texto </td><td>texto</td></tr></table><table border='2'><tr><td>texto </td><td>texto</td></tr></table>";
}


</script>
<input type="button" name="Button" value="Button" onClick="ACCION()">
<div id="escribeAqui"></div>
</body>
</html>

caricatos · #4 (**permalink**) 23/03/2006, 16:40

Si, poner document.write con la página cargada no es lo mejor...

Si quieres clonar una tabla, puedes usar cloneNode (cosas del DOM)

function duplicar() {
var nuevaTabla = document.getElementById("tabla").cloneNode(true);
document.body.appendChild(nuevaTabla);
}

Saludos

chefnelone · #5 (**permalink**) 24/03/2006, 04:20

Lo estoy probando

muchas gracias
saludos

chefnelone · #6 (**permalink**) 24/03/2006, 06:38

Cita:

Iniciado por caricatos

Si, poner document.write con la página cargada no es lo mejor...

Si quieres clonar una tabla, puedes usar cloneNode (cosas del DOM)

function duplicar() {
var nuevaTabla = document.getElementById("tabla").cloneNode(true);
document.body.appendChild(nuevaTabla);
}

Saludos

hola a todos

Si andas por ahí Caricatos. He usado tu funcion y me ha ido de maravilla.

Solo una cosa. Como puedo hacer para ocultar esa tabla nueva que he creado. O sea una vez que se crea el usuario la utiliza pero despues necesito ocultarla de nuevo. He probado con

document.getElementById('tabla').style.display ='none';

pero solo borra el original pero no el duplicado
.saludos

caricatos · #7 (**permalink**) 24/03/2006, 06:43

Tienes razón. Es que se duplica todo, incluso el id (un fallo tonto)... tendrías que asignarle otro id...

function duplicar() {
var nuevaTabla = document.getElementById("tabla").cloneNode(true);
nuevaTabla.id = "nuevaTabla";
document.body.appendChild(nuevaTabla);
}

Y se ocultaría con:

document.getElementById('nuevaTabla').style.displa y ='none';

Si se van a clonar más de una tabla, sería mejor ponerle algo así:
tabla = 0;
nuevaTabla.id = "tabla" + tabla++;

saludos

chefnelone · #8 (**permalink**) 24/03/2006, 07:00

muchas gracias
saludos