innerHTML? o es con otra función?

7th_Sign · #1 (**permalink**) 29/11/2007, 18:39

Hola Foro,

Estoy tratando de hacer una tabla en la cuál se le de click a un simbolito de "+" y se agrege un nuevo renglon.
Con innerHTML he logrado hacerlo sin problema pero ahora quiero hacer que esto se inserte en medio de 2 renglones, es decir en cada renglón en la última columna llevará el botón o liga que indica que si se le da click ahí se agrega un renglon justo abajo recorriendo los renglones existentes.

Con innerHTML puedo hacerlo muy bien pero me los pone al final, quizas me haga falta pasarle algún parametro o definitivamente esto no se puede hacer?

Agradezco cualquier respuesta.

Saludos

Sir Matrix · #2 (**permalink**) 30/11/2007, 07:32

Hola, lo que se puede hacer es crear un nuevo renglón al final y pasarle los valores del renglón intermedio a éste.

Luego limpias el renglón de entremedio y parecerá que se agregó uno nuevo en esa posición.

Saludos

JavierB · #3 (**permalink**) 30/11/2007, 10:50

Hola 7th_Sign

Me he entretenido un rato haciendo este código, espero que te sirva:

Código PHP:

  <html>
<head>
<script type="text/javascript">
function anadir(obj) {
  fila = obj.parentNode.parentNode;
  tabla = fila.parentNode;
  lineas = tabla.getElementsByTagName('tr');
  // averiguar fila pulsada
  for (i=0; ele = lineas[i]; i++)
    if (ele==fila) break;
  // crear fila, celdas y botón
  f = document.createElement('tr');
  c = f.appendChild(document.createElement('td'));
  c.innerHTML = '---';
  c = f.appendChild(document.createElement('td'));
  b = document.createElement('input');
  b.setAttribute('type','button');
  b.onclick = function() {anadir(this)}
  c.appendChild(b);
  
  if (i==lineas.length-1)
    tabla.appendChild(f);
  else
    tabla.insertBefore(f,lineas[i+1]);
}
</script>
</head>
<body>
<table>
<tbody>
<tr><td>-1-</td><td><input type="button" onclick="anadir(this)" /></td></tr>
<tr><td>-2-</td><td><input type="button" onclick="anadir(this)" /></td></tr>
<tr><td>-3-</td><td><input type="button" onclick="anadir(this)" /></td></tr>
</tbody>
</table>
</body>
</html>

Saludos,

7th_Sign · #4 (**permalink**) 30/11/2007, 18:31

JavierB, gracias por la ayuda, funciono muy bien, básicamente lo que me hacia falta era el

Código:

  fila = obj.parentNode.parentNode;
  tabla = fila.parentNode;
  lineas = tabla.getElementsByTagName('tr');

Saludos