Olá eu fiz igual o professor instruiu na aula, porém quando eu clico no botão "Buscar" ele adiciona os tr e td direitinho, mas eles aparecem sem conteúdo (vazios) e eu não consigo identificar o porque disso estar ocorrendo. Tem como alguém me ajudar, segue os códigos com o nome das abas em cima para dividi=los e dar mais contexto.
buscar_paciente9.js
var botaoBuscar = document.querySelector("#buscar-paciente");
botaoBuscar.addEventListener("click", function(){
var xhr = new XMLHttpRequest();
xhr.open("GET", "http://api-pacientes.herokuapp.com/pacientes");
xhr.addEventListener("load", function(){
var resposta = xhr.responseText;
var pacientes = JSON.parse(resposta);
pacientes.forEach( function(paciente) {
adicionaPacienteNaTabela(paciente);
});
});
xhr.send();
});
form.js
var botaoAdicionar = document.querySelector("#adicionar-paciente");
botaoAdicionar.addEventListener("click",function(event){
event.preventDefault();
var form = document.querySelector("#form-adiciona");
var paciente = obtemPaciente(form);
var erros = MensagemDeErros(paciente);
console.log(erros);
if(erros.length > 0){
exibeMensagemDeErros(erros);
return;
}
adicionaPacienteNaTabela(paciente);
form.reset();
var limpaUl = document.querySelector("#mensagens-erros")
limpaUl.innerHTML = "";
});
function obtemPaciente(form){
var dados = {
nomeValue: form.nome.value,
pesoValue: Number(form.peso.value).toFixed(2),
alturaValue: Number(form.altura.value).toFixed(2),
gorduraValue: Number(form.gordura.value).toFixed(2),
imcValue: calculaImc(form.peso.value,form.altura.value)
};
return dados;
};
function montaTd(dado,classe){
var tdPronta = document.createElement("td");
tdPronta.textContent = dado;
tdPronta.classList.add(classe);
return tdPronta;
}
function montaTr(paciente){
var trPronta = document.createElement("tr");
trPronta.classList.add("paciente");
trPronta.appendChild(montaTd(paciente.nomeValue,"info-nome"));
trPronta.appendChild(montaTd(paciente.pesoValue,"info-peso"));
trPronta.appendChild(montaTd(paciente.alturaValue,"info-altura"));
trPronta.appendChild(montaTd(paciente.gorduraValue,"info-gordura"));
trPronta.appendChild(montaTd(paciente.imcValue,"info-imc"));;
return trPronta;
};
function MensagemDeErros(paciente){
var erros = [];
if(!validaPeso(paciente.pesoValue)){
erros.push("Peso Inválido");
}
if(!validaAltura(paciente.alturaValue)){
erros.push("Altura Inválida");
}
if(paciente.gorduraValue.length == 0){
erros.push("Gordura não pode ficar em branco (miguérsrs)");
}
if(paciente.nomeValue.length < 2){
erros.push("O nome não pode conter menos de dois caracteres");
}
return erros;
}
function adicionaPacienteNaTabela(paciente){
var pacienteTr = montaTr(paciente);
var tabela = document.querySelector("#tabela-pacientes");
tabela.appendChild(pacienteTr);
};
function exibeMensagemDeErros(erros){
var ul = document.querySelector("#mensagens-erros");
ul.innerHTML = "";
erros.forEach(function(erro){
var li = document.createElement("li");
li.textContent = erro;
ul.appendChild(li);
})
}