entre Desarrolladores

Recibe ayuda de expertos

Registrate y pregunta

Es gratis y fácil

Recibe respuestas

Respuestas, votos y comentarios

Vota y selecciona respuestas

Recibe puntos, vota y da la solución

Pregunta

2votos

Error quitando elementos con javascript

Saludos de nuevo, tengo un problema tengo un formulario con el que mediante javascript añado un clon del ultimo tr
como pueden ver en esta imagen
enter image description here

Cuando tengo solo un tr y presiono remover no se va (eso esta bien) pero cuando añado y le doy a Remover hasta quedar solo 1 otra vez, al presionar Remover
me queda esto
enter image description here

aca les dejo el javascript , no se si algo estoy haciendo mal

<script>
$(document).ready(function ($) {
// trigger event when button is clicked
$("button.add").click(function () {
    // add new row to table using addTableRow function
    addTableRow($("#table_added"));
    // prevent button redirecting to new page
    return false;

});

// function to add a new row to a table by cloning the last row and 
// incrementing the name and id values by 1 to make them unique
function addTableRow(table) {

    // clone the last row in the table
    var $tr = $(table).find("tbody tr:last").clone();

    // get the name attribute for the input and select fields
    $tr.find("input,select").attr("name", function () {
        // break the field name and it's number into two parts
        var parts = this.attr;//.match(/(\D+)(\d+)$/);
        // create a unique name for the new field by incrementing
        // the number for the previous field by 1
        return parts;//[1] + ++parts[2];

        // repeat for id attributes
    }).attr("id", function () {
        var parts = this.attr;//id.match(/(\D+)(\d+)$/);
        return parts;//[1] + ++parts[2];
    });
    // append the new row to the table
    $(table).find("tbody tr:last").after($tr);
    $tr.hide().fadeIn('slow');

    // row count
    rowCount = 0;
    $("#table tr td:first-child").text(function () {
        return ++rowCount;
    });

    // remove rows
    $(".remove_button").on("click", function () {
        if ( $('#table tbody tr').length == 1) return;
        $(this).parents("#table_added tbody tr").fadeOut('slow', function () {
            $(this).remove();
            rowCount = 0;
            $("#table tr td:first-child").text(function () {
                return ++rowCount;
            });
        });
    });

};

});
</script>

1 Respuesta

0voto

Leonardo-Tadei Puntos227010

Hola Christian,

me parece que tu problema es que

if ( $('#table tbody tr').length == 1)

no está devolviendo 1 cuando queda solo una fila. Poné el largo en un console.log() y fijate qué valores tiene, ya que por lo que describís cuando vale 1 igual se ejecuta la parte de remover del código.

Por otra parte, la variable rowCount en la que mantenés la cantidad de filas no tiene uso y podés borrarla sin problemas. En vez de consultar rowCount estás contando la tantidad de elementos que hay... pero igual no funcionaría por un problema de ámbito, ya que al no declararla como var rowCount, no está asignada en la función interna.

Saludos!

Por favor, accede o regístrate para responder a esta pregunta.

Otras Preguntas y Respuestas


...

Bienvenido a entre Desarrolladores, donde puedes realizar preguntas y recibir respuestas de otros miembros de la comunidad.

Conecta