Assim como a função para calcular o IMC, eu tentei usar a função de validação em outro script.
No validation.js (script onde eu crio a função para validar os dados) ficou assim:
checkPaciente();
function checkPaciente() {
var trPaciente = document.querySelectorAll(".paciente");
var i = 0;
while (i < trPaciente.length){
var pacientes = trPaciente[i];
var tdPeso = pacientes.querySelector(".info-peso");
var peso = tdPeso.textContent;
var tdAltura = pacientes.querySelector(".info-altura");
var altura = tdAltura.textContent;
var tdIMC = pacientes.querySelector(".info-imc");
var isPesoValid = true;
var isAlturaValid = true;
if (peso <= 0 || peso >= 1000) {
isPesoValid = false;
pacientes.classList.add("paciente-invalido");
tdIMC.textContent="Peso inválido";
}
if (altura <= 0 || altura >= 1000) {
isAlturaValid = false;
pacientes.classList.add("paciente-invalido");
tdIMC.textContent="Altura inválida";
}
if (isPesoValid == false && isAlturaValid == false) {
tdIMC.textContent = "Dados inválidos"
}
if (isPesoValid == true && isAlturaValid == true) {
tdIMC.textContent = calcIMC(peso,altura);
}
i++
}
}
E no script onde eu crio de fato a TR, eu apenas "chamo" a função de validação:
var buttonAdd = document.querySelector("#adicionar-paciente");
function addNewUser(){
var form = document.querySelector(".form-adiciona")
var paciente = formData(form);
var pacienteTr = createTr(paciente);
var tabelaPacientes = document.querySelector("#tabela-paciente")
tabelaPacientes.appendChild(pacienteTr);
form.reset();
checkPaciente();
}
buttonAdd.onclick = addNewUser;
Minha dúvida de convenção é, no script validation.js, eu inicio ele chamando a função para que já carregue junto da página e valide os dados que eu coloquei na raiz (direto no HTML) e depois eu chamo a mesma função quando clico no botão para adicionar o novo paciente (no outro script) para aí validar novamente. Isso é errado? Tem alguma regra de convenção? Porque de verdade achei que ficou mais organizado hahaha