1

Tenho uma table com um botão excluir onde o mesmo deveria, ao ser clicado, excluir o registro em questão, porém quando clico em excluir ele realiza a exclusão correta no banco e ao atualizar a table ele apaga a linha de cima (registro anterior) no front-end do site.

//Insiro o botão na table com mais algumas infos

$('#tabela').append('<tr class="linha"><td align="center">' + $('#cbUnidadeOrigem option:selected').text() + '</td><td align="center">' + $('#unidade_destino option:selected').text() + '</td><td align="center" class="valCodBarras">' + txCdBarras.val() + '</td><td align="center">' + moment().format("DD/MM/YYYY HH:mm:ss") + '</td><td align="center"><a class="btn btn-danger btn-xs btExcluir" href="javascript:void(0)" rel=""><i class="icon-trash "></i></a></td></tr>');


//ajax para excluir o campo e limpar a table na linha

$('.btExcluir').on('click', function() {
  if (confirm('Deseja exluir este item?')) {


    jQuery.ajax({
      type: "GET", // HTTP method POST or GET
      url: "/malote/delMovMalote.php?id=" + $(this).attr('rel'),
      dataType: "text", // Data type, HTML, json etc.
      async: false,
      success: function(response) {
        $("#btExcluir").$(this).closest("tr").hide();
        countTabela = jQuery("#table tbody tr").length;
        countTabela--;
        $('#counter').html(countTabela);
      }
    });
  }
});

Eu sei que é um erro simples mas estou meio perdido nisso.

1 Resposta 1

1

Não uses this dentro dessa callback, o jQuery muda o escopo dessa função e o this é o objeto ajax.

Para além disso assim $("#btExcluir") vai sempre dar o mesmo elemento visto que IDs têm de ser únicas.

Podes criar um alias e assim garantes que o .closest() usa como ponto de partida o botão clicado:

$('.btExcluir').on('click', function() {
  var btn = this;
  if (confirm('Deseja exluir este item?')) {


    jQuery.ajax({
      type: "GET", // HTTP method POST or GET
      url: "/malote/delMovMalote.php?id=" + $(this).attr('rel'),
      dataType: "text", // Data type, HTML, json etc.
      async: false,
      success: function(response) {
        $(btn).closest("tr").hide();
        countTabela = jQuery("#table tbody tr").length;
        countTabela--;
        $('#counter').html(countTabela);
      }
    });
  }
});
1
  • 1
    Era exatamente isso Sergio, muito obrigado pela explicação ! Commented 20/06/2017 às 16:39

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .