Depois de adicionar os novos pacientes e coloca-los na tabela, gostaria que eles também fosse validados e pintados de outro cor caso os dados fossem errados. tentei fazer com esse código mas não funcionou:
var titulo = document.querySelector(".titulo");
//var pacientes = document.querySelectorAll('.paciente');
var paciente = document.querySelector("#primeiro-paciente");
var i = 0;
validaTabela();
function validaTabela(){
var pacientes = document.querySelectorAll('.paciente');
while (i < 5) {
paciente = pacientes[i];
var tdAltura = paciente.querySelector(".info-altura");
var tdPeso = paciente.querySelector(".info-peso");
var tdImc = paciente.querySelector(".info-imc");
var altura = tdAltura.textContent;
var peso = tdPeso.textContent;
var alturaEhValida = true;
var pesoEhValido = true;
if (peso <= 0 || peso > 1000) {
tdPeso.textContent = "Peso inválido!";
pesoEhValido = false;
paciente.classList.add("paciente-invalido");
}
if (altura <= 0 || altura >= 3) {
tdAltura.textContent = "Altura inválida!";
alturaEhValida = false;
paciente.classList.add("paciente-invalido");
}
if (alturaEhValida && pesoEhValido) {
var imc = (peso / (altura * altura)).toFixed(2);
tdImc.textContent = imc;
paciente.classList.add("paciente-valido");
} else {
tdImc.textContent = "Altura e/ou peso inválidos!"
paciente.classList.add("paciente-invalido");
}
i++;
}
}
var btnAdd = document.querySelector("#adicionar-paciente");
btnAdd.addEventListener("click", function(event) {
event.preventDefault();
formAdd = document.querySelector("#form-adiciona");
var nome = formAdd.nome.value;
var peso = formAdd.peso.value;
var altura = formAdd.altura.value;
var gordura = formAdd.gordura.value;
console.log(nome + peso + altura + gordura);
var pacienteTr = document.createElement("tr");
var nomeTd = document.createElement("td");
var pesoTd = document.createElement("td");
var alturaTd = document.createElement("td");
var gorduraTd = document.createElement("td");
var imcTd = document.createElement("td");
nomeTd.textContent = nome;
pesoTd.textContent = peso;
alturaTd.textContent = altura;
gorduraTd.textContent = gordura;
imcTd.textContent = calculaIcm(peso, altura);
pacienteTr.appendChild(nomeTd);
pacienteTr.appendChild(pesoTd);
pacienteTr.appendChild(alturaTd);
pacienteTr.appendChild(gorduraTd);
pacienteTr.appendChild(imcTd);
document.querySelector("#tabela-pacientes").appendChild(pacienteTr);
validaTabela();
})
function calculaIcm(peso, altura) {
return (peso / (altura * altura));
}