añadir filas a tabla dinamicamente

[danielico3]

hola buenas.Estoy programando con php y sql. A ver si alguien puede ayudarme en esto. Resulta que hago una consulta a una tabla de una base de datos y el resultado lo imprimo en una tabla (en html). Ahora a esta misma tabla quiero seguir añadiendole filas para seguir metiendole datos. MI idea es poner un botón que al pulsarle cree una fila nueva. He encontrado códigos en javascript que hacen casi lo q yo necesito, pero al insertar la nueva fila me copia el contenido de la primera fila que se imprimio en la tabla y yo quiero que la fila este vacia o que en la primera celda de la fila escriba el valor autoincrementado ya que el primer valor es un número. Muchas gracias! :)

[GatorV]

Hola danielico3,

Eso se hace con JavaScript, y tienes que manipular el DOM.

Si lo quieres es hacer como un grid dinámico te recomiendo veas la librería ExtJS.

Te muevo al foro de Javascript donde te podrán asesorar correctamente.

Saludos.

[codigojavascript]

danielico3: Te paso un ejemplo que hace lo que necesitas pero con elemento de formulario tipo texto (text).

No creo que sea muy dificil modificar este código para lograr adaptarlo a tus necesidades.

El enlace: Agregar opciones de Cuadros de texto en el formulario

Saludos

[danielico3]

Hola, muchas gracias por responder tan pronto! he estado mirando y he encontrado por fin lo que necesitaba en este mismo foro. Por si le interesa a alguien el código que buscaba está aqui:

http://www.forosdelweb.com/f13/filas-dinamicas-206414/

He usado el código de soniagrande.

Un saludo y de nuevo gracias!!

[codigojavascript]

danielico3:

He visto el ejemplo de soniagrande y no está mal, aunque no es muy funcional.

te dejo un ejemplo que acavo de programar:

Control Tabla - Oculta y muestra filas de una tabla

El mismo permite ocultar filas y volver a mostrarlas, es compatible con IE y Firefox, muestra un resumen de la cantidad de filas totales en la tabla, las filas mostradas y ocultas y permite ocultar y/o mostrar todas las filas de una sola vez.

espero que sirva.
saludos

[copycat]

Hola danielico:

Te dejo un scrip que he realizado para añadir y borrar filas dinamicamente de una tabla utilizando dos botones. Espero que te sirva.

function InsertRow() {
var TABLE = document.getElementById("elemtable");
var objRow = document.getElementById("elerow1");
var targetRow = TABLE.insertRow(-1);
var targetcellf = targetRow.insertCell(0);
var Cellscount = objRow.cells.length;
RowNumber = TABLE.rows.length;
targetRow.cells[0].innerHTML = RowNumber;
for (cnt=1; cnt < Cellscount; cnt++) {
var targetcell = targetRow.insertCell(cnt);
targetRow.cells[cnt].innerHTML = objRow.cells[cnt].innerHTML;
}

function removeLastRow() {
var TABLE = document.getElementById("elemtable");
if(TABLE.rows.length > 1) {
TABLE.deleteRow(TABLE.rows.length-1);
}
}

elemtable: es el Id de la tabla
elerow1: es el Id de la fila

<table id="elemtable">
<tr id="elerow1">

Los botones
<input type="image" src="../Intercambiadores/imagenes/InsertRow24.gif" alt="insertar" onClick="InsertRow()" />
<input type="image" src="../Intercambiadores/imagenes/RemoveRow24.gif" alt="borrar" onClick="removeLastRow()" />



Saludos