Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Ele remove todas as linhas de uma vez e sempre salva uma linha em branco

quando eu clico para sincronizar ele sempre salva uma linha em branco, e quando eu vou deletar as linhas, ele deleta todas de uma vez quando eu clico.

Voltei nos videos anteriores, pra ver se achava o erro, e mesmo assim não achei, segue a baixo o meu codigo do "placar.js":

$("#btn-placar").click(mostraPlacar);
$("#btn-sync").click(sincronizaPlacar);

function inserePlacar(){
    var corpoTabela = $(".placar").find("tbody");
    var usuario = "Victor";
    var numeroPalavras = $("#contador-palavras").text();

    var linha = novaLinha(usuario,numeroPalavras);

    linha.find(".botao-remover").click(function(){
        removeLinha();
        //console.log("Teste");
    });
    corpoTabela.append(linha);
    $(".placar").slideDown(500)
    scrollPlacar;
}

function scrollPlacar(){
   var posicaoPLacar =  $(".placar").offset().top;
   $("body").animate({
       scrollTop: posicaoPLacar+"px"
   },1000);
}

function removeLinha(){
    event.preventDefault();
    $(".botao-remover").parent().parent().fadeOut(1000);
    setTimeout(function(){
        $(".botao-remover").parent().parent().remove();
    },1000)
}

function novaLinha(usuario,numeroPalavras){
    var linha = $("<tr>");
    var colunaUsuario = $("<td>").text(usuario);
    var colunaPalavras = $("<td>").text(numeroPalavras);
    var colunaRemover = $("<td>");

    var link = $("<a>").addClass("botao-remover").attr("href","#");
    var icone = $("<i>").addClass("small").addClass("material-icons").text("delete");

   link.append(icone);
   colunaRemover.append(link);

   linha.append(colunaUsuario);
   linha.append(colunaPalavras);
   linha.append(colunaRemover);

   return linha;
}

function mostraPlacar(){
  //  $(".placar").toggle();
  $(".placar").stop().slideToggle(500);
}

function sincronizaPlacar(){
    var placar = [];
    // todas as tr que são filhas diretas de tbody
    var linhas = $("tbody>tr");
    linhas.each(function(){
        var usuario = $(this).find("td:nth-child(1)").text();
        var palavras = $(this).find("td:nth-child(2)").text();

        var score = {
            usuario: usuario,
            pontos: palavras
        };
        placar.push(score);
    });
    var dados = {
        placar: placar
    };

    $.post("http://localhost:3000/placar",dados,function(){
       // alert("Salvou o placar no servidor");
    });

}
function atualizaPlacar(){
    $.get("http://localhost:3000/placar",function(data){
        $(data).each(function(){
            var linha = novaLinha(this.usuario, this.pontos);

            //modificado aqui
            linha.find(".botao-remover").click(removeLinha);

            $("tbody").append(linha);
        });
    });
}
1 resposta
solução!

Bom, copiei o código atualizado do arquivo Placar.js do projeto do professor, e funcionou a remoção de linha, porém, depois revisei a versão dele com a minha e mesmo assim não consegui achar o erro, mas.... com certeza é falta de atenção minha em algo.

(O.B.S: não sei como finalizar o post no forum )

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software