Cómo eliminar todas las filas de una tabla, que se han creado en forma dinámica?

publicado por: Anonymous

Tengo una tabla y un botón que al presionarlo genera una fila de la tabla, clonando una fila oculta que se tiene como plantilla:

function agregaFila()
{
nid++;
$("#tabla tbody tr:eq(0)").clone().removeClass('fila-base').attr("id",nid).appendTo("#tabla tbody");
};

Esta fila plantilla tiene varias columnas, con elementos en cada una de esas columnas. En la columna final, hay una clase “.Eliminar”, que al presionarlo elimina la fila seleccionada:

var parent = $(this).parents().get(0);
var fila=$(parent).attr('id');
console.log(fila);
$(parent).remove();

En régimen de uso, el usuario puede haber creado múltiples filas y haber eliminado filas a su gusto (intercaladas, consecutivas, la primera, la última, etc).

Una vez que se ha grabado la información de la tabla, se deben eliminar todas las fila de la tabla, excepto la primera y es aquí que tengo el problema, pues no he logrado implementar la forma de identificar las filas que están desplegadas en la tabla y eliminarlas, excepto la primera.

Cualquier ayuda, me es de mucho valor y desde ya la agradezco.


Creo que con algo como esto puedo empezar:

$("#tabla tbody tr").each(function () 
{
  i=i+1;

con esto cuento las n filas existentes y luego hago el mismo recorrido de las filas, eliminándolas hasta n-1, voy a ver cómo resulta.


Si a alguien le sirve, lo solucioné creando la siguiente función:

function eliminaFilas()
{
//OBTIENE EL NÚMERO DE FILAS DE LA TABLA
var n=0;
$("#tabla tbody tr").each(function () 
{
n++;
});
//BORRA LAS n-1 FILAS VISIBLES DE LA TABLA
//LAS BORRA DE LA ULTIMA FILA HASTA LA SEGUNDA
//DEJANDO LA PRIMERA FILA VISIBLE, MÁS LA FILA PLANTILLA OCULTA
for(i=n-1;i>1;i--)
{
$("#tabla tbody tr:eq('"+i+"')").remove();
};
};

solución

Se me ocurre que a la primera fila (la base) le puedes agregar una clase para distinguirla.

<tr class="primerFila"></tr>

Recuerda, la clase solo es para distinguir. Luego en tu código JS que clona puedes hacer lo siguiente:

function agregaFila()
{
    nid++;
    $(".primerFila").eq(0).clone().addClass("otrasFilas").removeClass("primerFila").attr("id", nid).appendTo("#tabla tbody");
};

Y luego para eliminar todas las filas excepto la primera:

function eliminarFilas()
{
    $(".otrasFilas").remove();
}
Respondido por: Anonymous

Leave a Reply

Your email address will not be published. Required fields are marked *