Pai x Filho (ID da linha após exclusão)

Boa tarde, @Comunidade.

Estou com uma demanda que é a seguinte:

O usuário copia células de uma planilha excel e cola dentro de um text area no formulário. Depois ele clica em um botão e esse botão preenche uma tabela pai filho com as informações copiadas. Dessa forma ele não precisa copiar uma célula por vez.

Imagem para ilustrar: exemplo1.png

Essa funcionalidade já está implementada.

Porém caso o usuário exclua por engano alguma linha da tabela e clique no botão "Converter" novamente, ocorre o seguinte (nesse caso eu excluí a segunda linha e cliquei em converter novamente): exemplo2.png

E outro problema que estou enfrentando é que se o usuário eventualmente excluir alguma linha do text area "CAMPOS EXCEL" essa linha não é removida da tabela quando clicado em converter novamente. Segue imagem que exemplifica (coloquei primeiro as mesmas três linhas e cliquei em converter, depois removi a segunda linha e cliquei em converter novamente e a terceira linha se duplicou): exemplo3.png

Segue meu código js e html:

<div class="row">
    <div class="form-group col-md-12">
        <table id="EXCEL" tablename="EXCEL" class="table table-striped table-bordered " border="0" nodeletebutton="false" noaddbutton="true">
            <thead>
                <tr>
                    <td class="form-group col-md-2" style="text-align: center; font-size: 18px; color: #666666; background-color: #f9f9f9;">Código</td>
                    <td class="form-group col-md-2" style="text-align: center; font-size: 18px; color: #666666; background-color: #f9f9f9;">Data</td>
                    <td class="form-group col-md-7" style="text-align: center; font-size: 18px; color: #666666; background-color: #f9f9f9;">Observação</td>
                </tr>
            </thead>
            <tr>
                <td style="vertical-align: middle; text-align: center;">
                    <input id="CODIGO" name="CODIGO" type="text" class="form-control">
                </td>

                <td style="vertical-align: middle; text-align: center;">
                    <input id="DATAEXCEL" name="DATAEXCEL" type="text" class="form-control">
                </td>


                <td style="vertical-align: middle; text-align: center;">
                    <input id="OBSERVACAO" name="OBSERVACAO" type="text" class="form-control">
                </td>

            </tr>
        </table>
    </div>
</div>

<div class="row">
    <div class="form-group col-md-2">
        <button class="btn btn-default" id="adicionarItem" name="adicionarItem" onclick="childAdd();"><span class="info">Adicionar Item</span></button>
    </div>
</div>
function fnConverter(){

    var y = $("#CAMPOS").val().split("\n");

    var x = "";
    var row = 1;

    for (var j = 0; j < y.length; j++){
        x = y[j].replace("    ", "\n").replace("    ", "\n").split("\n");        
        var cod = x[0];
        var data = x[1];
        var obs = x[2];

        $("#CODIGO___" + row).val(cod);
        $("#DATAEXCEL___" + row).val(data);
        $("#OBSERVACAO___" + row).val(obs);

        row++;

        if($("#EXCEL tr").length <= y.length + 1){
            childAdd();
        }
    }
}

Alguém tem alguma ideia de como poderia resolver esse problema?

Agradeço a atenção desde já.

Atenciosamente, Leonardo Fioretti.

compartilhar
  1. Você vai ver essas setas em qualquer página de pergunta. Com elas, você pode dizer se uma pergunta ou uma resposta foram relevantes ou não.
  2. Edite sua pergunta ou resposta caso queira alterar ou adicionar detalhes.
  3. Caso haja alguma dúvida sobre a pergunta, adicione um comentário. O espaço de respostas deve ser utilizado apenas para responder a pergunta.
  4. Se o autor da pergunta marcar uma resposta como solucionada, esta marca aparecerá.
  5. Clique aqui para mais detalhes sobre o funcionamento do fluig Forum!

0 resposta

Não é a resposta que estava procurando? Procure outras perguntas com as tags paifilho paixfilho wdkaddchild remove delete ou faça a sua própria pergunta.