Galera estou com a idéia de converter todo o projeto de JS vanila para jQueri. Comecei com o arquivo form.js. Esta funcionando,mas acho que posso melhorar, se alguem tiver sugestões para enriquecer agradeço.
let botaoAdicionar = $("#adicionar-paciente");
botaoAdicionar.on("click", function (event) {
event.preventDefault();
let form = $("#formulario");
var paciente = obtemPacienteDoFormulario();
//console.log(paciente);
let mensagemErro = validaPaciente();
if (mensagemErro.length > 0) {
exibeMensagemDeErros(mensagemErro)
return
}
adicionaPacienteNaTabela(paciente);
form.trigger("reset");
$("#mensagem-error").html("");
});
function validaPaciente() {
//console.log(paciente.nome);
let error = [];
if ($("#nome").val().length == 0) {
error.push("Nome em Branco, favor digitar novamente!");
}
if (!validaPeso($("#peso").val())) {
error.push("Peso inválido!");
}
if (!validaAltura($("#altura").val())) {
error.push("Altura inválida!");
}
if ($("#gordura").val().length == 0) {
error.push("A gordura não pode ser em branco!");
}
if ($("#altura").val().length == 0) {
error.push("A altura não pode ser em branco!");
}
if ($("#peso").val().length == 0) {
error.push("A peso não pode ser em branco!");
}
return error;
}
function adicionaPacienteNaTabela(paciente) {
let pacienteTr = montaTr(paciente);
let tabela = $("#tabela-pacientes");
tabela.append(pacienteTr);
}
function obtemPacienteDoFormulario() {
let paciente = {
nome: $("#nome").val(),
peso: $("#peso").val(),
altura: $("#altura").val(),
gordura: $("#gordura").val(),
imc: calculaImc($("#peso").val(), $("#altura").val())
};
return paciente;
}
function montaTr(paciente) {
let pacienteTr = $("<tr>");
pacienteTr.addClass("paciente");
pacienteTr.append(montaTd(paciente.nome, "info-nome"));
pacienteTr.append(montaTd(paciente.peso, "info-peso"));
pacienteTr.append(montaTd(paciente.altura, "info-altura"));
pacienteTr.append(montaTd(paciente.gordura, "info-gordura"));
pacienteTr.append(montaTd(paciente.imc, "info-imc"));
return pacienteTr;
}
function montaTd(dado, classe) {
let td = $("<td>");
td.text(dado);
td.addClass(classe);
return td;
}
function exibeMensagemDeErros(mensagemErro) {
let ul = $("#mensagem-error");
ul.html("");
mensagemErro.forEach(function (erro) {
let li = $("<li>");
li.text(erro);
console.log(erro);
ul.append(li);
});
}
insira seu código aqui