Tablas con document.getElementById()...

[rimon]

Hola

Primero muestro el codigo:

Código:

<script type="text/javascript">
function ver() {
document.getElementById('algo').innerHTML= "<tr><td>Hola</td><td>Adios</td></tr>";
}
</script>

Ahora muestro la tabla donde ejecuto esa funcion js

Código:

<table border="1" cellspacing="0" cellpadding="0">
<div id="algo"></div>
</table>
<input type="button" value="activar" onclick="ver()">

Pues cuando presiono el boton de "ativar" los datos de la funcion js, los devuelve FUERA de la tabla.. es como si ignorara las etiquetas de la tabla, se entiende?

Si por ejemplo.. creo toda la tabla desde js, funciona.. pero cuando utilizo solo las etiquetas de filas/columnas.. no me va..

Ayuda?

Gracias y Saludos.

[JavierB]

Hola rimon

Creo que deberías quitar el div y poner el id a la tabla:

Código:

<table border="1" cellspacing="0" cellpadding="0" id="algo">
</table>
<input type="button" value="activar" onclick="ver()">

Saludos,

[rimon]

Gracias por responder :)

Pero no me funciona, sigue mostrando el valor fuera de la tabla.. aun asi no creo que tenga mucho sentido tu ejemplo, ya que si ves el siguiente ejemplo, ya muestro una fila dentro.. mientars se espera la siguiente generada por js.

Código:

<table border="1" cellspacing="0" cellpadding="0" id="algo">
<tr><td>Dato</td><td>Dato2</td></tr>
</table>
<input type="button" value="activar" onclick="ver()">

Supongamos que tu ejemplo funciona e inserta la fila de js.. pero como indicas exactamente en donde insertar la nueva fila?, si queres que sea insertada debajo de x fila o arriba de x fila.. ahi se complicaria siguiendo tu ejemplo.
Por eso lo ideal es atraves de <div>'s

Nose.. es raro.

Como dije antes.. yo si en javascript creo ahi mismo toda la tabla desde 0, funciona, pero si utilizo solo etiquetas para unirlas a otra tabla, el valor se ve fuera.

Gracias otra vez ;)

[JavierB]

Hola de nuevo.

En tu primer código no había ninguna fila dentro de la tabla

Echa un vistado a esta página, que seguro que te ayuda:

http://www.tierradenomadas.com/tw006b.html

Saludos,

[rimon]

Gracias javier, tiene buena pinta ;)

[frijolerou]

Amigo rimon, vamos por partes:

Iniciado por rimon

<table border="1" cellspacing="0" cellpadding="0">
<div id="algo"></div>
</table>
<input type="button" value="activar" onclick="ver()">

Al igual que un elemento TD sólo puede ser nodo hijo directo de un elemento TR, éste último sólo puede ser nodo hijo directo de un elemento TABLE. Por lo tanto ese elemento DIV siempre te va a quedar fuera de la tabla, ya que está puesto en un lugar que no le corresponde; un DIV puede ser nodo hijo directo de un elemento TD, pero no de un elemento TR ni de un elemento TABLE.

Iniciado por rimon

<table border="1" cellspacing="0" cellpadding="0" id="algo">
<tr><td>Dato</td><td>Dato2</td></tr>
</table>
<input type="button" value="activar" onclick="ver()">

Si utilizas la propiedad innerHTML para insertar filas en una tabla, innerHTML reemplazará todos los nodos hijos de la tabla por los nuevos. Es decir, en tu ejemplo cuando insertas la fila que contiene Hola y Adios reemplazará a la fila que contiene Dato2.

Iniciado por rimon

Supongamos que tu ejemplo funciona e inserta la fila de js.. pero como indicas exactamente en donde insertar la nueva fila?, si queres que sea insertada debajo de x fila o arriba de x fila.. ahi se complicaria siguiendo tu ejemplo.

Si lo que quieres es ir insertando nuevas filas en un determinado lugar de la tabla debes trabajar más. En primer lugar la fuena fila debes crearla como OBJECT y no como STRING. Para eso debes recurrir a los métodos y propiedades que te proporciona el DOM (Document Object Model). Y en segundo lugar debes recurrir nuevamente al DOM para seleccionar un punto dentro de la tabla e insertar ahí la nueva fila creada.

Te recomiendo un artículo/tutorial sobre DOM en Kusor.net (en castellano).