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

AppendChild parou de funcionar?

Olá, boa noite!

Essa dúvida é referente a aula 5 tópico 6:

A tarefa é enxugar o código capturando o dado do paciente e adicionando uma classe a ele, só que ao clicar no botão adicionar meu código apresenta um erro no appendChild, não consegui identificar o que é.

erro:

"Uncaught TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'. at montaTr (form.js:40) at HTMLButtonElement. (form.js:11)"

Segue abaixo o código:


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

    event.preventDefault();

    var form = document.querySelector("#form-adiciona");

    var paciente = dadosDoFormulario(form);

    var pacienteTr = montaTr(paciente);

    var tabela = document.querySelector("#tabela-pacientes");

    tabela.appendChild(pacienteTr);

})

function dadosDoFormulario(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");
    pacienteTd.classList.add("paciente");

    var nomeTd = montaTd(paciente.nome, "info-nome");
    var pesoTd = montaTd(paciente.peso, "info-peso");
    var alturaTd = montaTd(paciente.altura, "info-altura");
    var gorduraTd = montaTd(paciente.gordura, "info-gordura");
    var imcTd = montaTd(paciente.imc, "info-imc");

    pacienteTr.appendChild(nomeTd);
    pacienteTr.appendChild(pesoTd);
    pacienteTr.appendChild(alturaTd);
    pacienteTr.appendChild(gorduraTd);
    pacienteTr.appendChild(imcTd);

    return pacienteTr;
}

function montaTd(dado, classe) {
    var td = document.createElement("td");
    td.textContent = dado
    td.classList.add(classe)
}
1 resposta
solução!

Fala Yago, tudo bem?

Acredito que o problema esteja na função montaTd em que ela não retorna o elemento criado, caso esse elemento não seja retornado, as variáveis nomeTd, pesoTd, etc... receberão o valor de undefined pois esperam armazenar essa td criada pois nós, então para resolver apenas retorne esse elemento:

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

    return td
}

Espero ter ajudado, bons estudos :D