Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Assim que eu preencho um formulário, uma linha da tabela é criada! Na última coluna desta tabela, nascem dois botões um "editar" e um "excluir" (para cada nova linha adicionada)! Só que não consigo fazer o JS escutar o evento "click" no botão "excluir" criado pelo próprio JS. Como posso fazer isso?
Oi Hugo, boa noite
Cara, dá uma lida nesse carinha aqui oh: http://api.jquery.com/on/
É ele que vai resolver seu problema :)
Não consigo excluir a linha do botão (".btnDelete") que eu clico! Qual o erro do código?
$(document).ready();
var botaoAdcProduto = $(".botaoAdicionar");
botaoAdcProduto.click(function(event){
event.preventDefault();
montaLinhaProduto ();
});
function montaLinhaProduto(){
var nomeProduto = $("#nome-do-produto").val();
var classeProduto = $("#classe-do-produto").val();
var precoProduto = $("#preco-do-produto").val();
var tdNome = $("<td>").addClass("dadoProduto");
var tdClasse = $("<td>").addClass("dadoProduto");
var tdPreco = $("<td>").addClass("dadoProduto");
var tdAcao = $("<td>").addClass("dadoProduto");
var btnEdt = $("<button>").addClass("btn-sm").addClass("btn-primary").addClass("btnProduto").text("Editar");
var btnDlt = $("<button>").addClass("btn-sm").addClass("btn-danger").addClass("btnProduto").addClass("btnDelete").text("Excluir");
btnDlt.attr("data-toggle", "modal"). attr("data-target", "#deletar-produto");
var linhaProduto = $("<tr>").addClass("linha-de-produto");
linhaProduto.find(".btnDelete").click(removeProduto);
linhaProduto.append(tdNome.text(nomeProduto));
linhaProduto.append(tdClasse.text(classeProduto));
linhaProduto.append(tdPreco.text(precoProduto));
linhaProduto.append(tdAcao.append(btnEdt));
linhaProduto.append(tdAcao.append(btnDlt));
var listaProdutos = $(".corpoDaTabela").append(linhaProduto);
};
function removeProduto(event){
event.preventDefault();
$(this).parent().parent().remove();
};Hugo, você pode colocar seu código de exemplo nesse site aqui https://jsfiddle.net, por favor? Digo, com todo seu html, js e etc.