Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Erro botão(event Click) - após separar o código seguindo as boas praticas em Java Script -o botao adicionar parou de funcionar ao preencher os dados do paciente não adiciona na tabela

var botaoAdicionar = document.querySelector("#adicionar-paciente"); botaoAdicionar.addEventListener("click", function(event){ event.preventDefault();

    var form = document.querySelector("#form-adiciona");
    //Extraindo informacoes do paciente do form
    var paciente = infoFormulario(form);

    //cria a tr e a td do paciente
    var pciente = montaTr(pacienteTr);


    //adicionando o paciente na tabela.
    var tabela = document.querySelector("#tabela-pacientes");

    tabela.appendChild(pacienteTr);

    form.reset();

});

function infoFormulario(form){
    var paciente = {
        nome: form.nome.value,
        peso: form.peso.value,
        altura: form.altura.value,
        gordura: form.gordura.value,
        imc: calculaImc(form.peso.value, form.altura.value)
    }

    return paciente;
}

function montaTr(paciente) {
    var pacienteTr = document.createElement("tr");
    pacienteTr.classList.add("paciente");

    pacienteTr.appendChild(montaTd(paciente.nome, "info-nome"));
    pacienteTr.appendChild(montaTd(paciente.peso, "info-peso"));
    pacienteTr.appendChild(montaTd(paciente.altura, "info-altura"));
    pacienteTr.appendChild(montaTd(paciente.gordura, "info-gordura"));
    pacienteTr.appendChild(montaTd(paciente.imc, "info-imc"));

    return pacienteTr;
}


function montaTd(dados){
    var Td = documentcreateElement("td");
    td.textContent = dado;
    td.classList.add(classe);
    return td;

}
2 respostas
solução!

Boa tarde, Eddie! Como vai?

Ao clicar nesse botão aparece alguma mensagem de erro no console do navegador? Se sim, vc poderia colar ela aqui, por favor? Outra coisa, vc poderia compartilhar o seu projeto no github e mandar o link aqui? Assim ficará mais fácil de te ajudar de forma efetiva.

Qualquer coisa é só falar!

Grande abraço e bons estudos, meu aluno!

Professor Gabriel boa noite!

Consegui arrumar graças a sua orientação usei o comando " console.log" e pelo navegador através da inspeção de elementos na aba console, vi que algumas variáveis estavam com os nomes diferentes no código .

Muitíssimo obrigado pela ajuda!

Abraço

var botaoAdicionar = document.querySelector("#adicionar-paciente"); botaoAdicionar.addEventListener("click", function(event){ event.preventDefault();

    var form = document.querySelector("#form-adiciona");
    //Extraindo informacoes do paciente do form
    var paciente = infoFormulario(form);

    //cria a tr e a td do paciente
    var pacienteTr = montaTr(paciente);


    //adicionando o paciente na tabela.
    var tabela = document.querySelector("#tabela-pacientes");

    tabela.appendChild(pacienteTr);

    console.log();

    form.reset();

});

function infoFormulario(form){
    var paciente = {
        nome: form.nome.value,
        peso: form.peso.value,
        altura: form.altura.value,
        gordura: form.gordura.value,
        imc: calculaImc(form.peso.value, form.altura.value)
    }

    return paciente;
}

function montaTr(paciente) {
    var pacienteTr = document.createElement("tr");
    pacienteTr.classList.add("paciente");

    pacienteTr.appendChild(montaTd(paciente.nome, "info-nome"));
    pacienteTr.appendChild(montaTd(paciente.peso, "info-peso"));
    pacienteTr.appendChild(montaTd(paciente.altura, "info-altura"));
    pacienteTr.appendChild(montaTd(paciente.gordura, "info-gordura"));
    pacienteTr.appendChild(montaTd(paciente.imc, "info-imc"));

    return pacienteTr;
}


function montaTd(dados){
    var td = document.createElement("td")
    td.textContent = dados;
    td.classList.add("classe");
    return td;

}