Solucionado (ver solución)
Solucionado
(ver solución)
2
respuestas

No logro que se borre el mensaje error cuando agrego el dato que decia que faltaba (Clase validando los datos del formulario)

Cuando intento agregar un paciente y no ingreso alguno de los datos salen los mensajes de error y no me permite agregar al paciente. Hasta ahi funciona correctamente, cuando agrego los datos faltantes y efectivamente agrega al paciente, los mensajes de error siguen apareciendo. Pude hacer funcionar mi codigo de todas formas pero usando otra alternativa. Quisiera saber si es valida la alternativa y ademas no logro ver el error por el cual no estoy consiguiendo el mismo resultado que el profesor.

Gracias :)

var botonAdicionar = document.querySelector("#adicionar-paciente");

botonAdicionar.addEventListener("click",function(event){
    event.preventDefault();

    var form = document.querySelector("#form-adicionar"); 
    var paciente = capturarDatosPaciente(form);
    var pacienteTr = construirTr(paciente);
    var errores = validarPaciente(paciente);

    if(errores.length > 0){
        exhibirMensajesErrores(errores);
        return;
    }


    var tabla = document.querySelector("#tabla-pacientes");
    tabla.appendChild(pacienteTr);
    form.reset();


    var mensajesErrores = document.querySelector("#mensajes-errores");


  mensajesErrores.textContent = ""; // segun el curso esta linea deberia ser mensajesErrores.innerHTML = "";


});

function capturarDatosPaciente(form){

    var paciente = {
        nombre: form.nombre.value,
        peso: form.peso.value,
        altura: form.altura.value,
        gordura: form.gordura.value,
        imc: calcularIMC(form.peso.value,form.altura.value)
    }
    return paciente; 
}

function construirTr(paciente){

       var pacienteTr = document.createElement("tr");     
       pacienteTr.classList.add("paciente");

       pacienteTr.appendChild(construirTd(paciente.nombre,"info-nombre"));
       pacienteTr.appendChild(construirTd(paciente.peso,"info-peso"));
       pacienteTr.appendChild(construirTd(paciente.altura,"info-altura"));
       pacienteTr.appendChild(construirTd(paciente.gordura,"info-gordura"));
       pacienteTr.appendChild(construirTd(paciente.imc,"info-imc"));

       return pacienteTr; 
}

function construirTd(dato,clase){
    var td = document.createElement("td");
    td.classList.add(clase);
    td.textContent = dato;
    return td;
}



function validarPaciente(paciente){
    var errores = []

    if(paciente.nombre.length == 0){
        errores.push("El nombre no puede estar vacío");
    }
    if(paciente.peso.length == 0){
        errores.push("El peso no puede estar vacío");
    }
    if(paciente.altura.length == 0){
        errores.push("La altura no puede estar vacía");
    }
    if(paciente.gordura.length == 0){
        errores.push("El %gordura no puede estar vacío");
    }
    if(!validarPeso(paciente.peso)){
        errores.push("El peso es incorrecto");
    }
    if(!validarAltura(paciente.altura)){
        errores.push("La altura es incorrecta");
    }
    return errores; 
}

function exhibirMensajesErrores(errores){
    var ul = document.querySelector("#mensajes-errores");
    ul.innerHTML = ""
    errores.forEach(function(error){
        var li = document.createElement("li");
        li.textContent = error;
        ul.appendChild(li);
    });
}
2 respuestas
solución!

Hola Julián!! podrías copiar el código tal cual lo tienes al momento de ejecutarse con error? estoy ejecutando lo que pasaste pero utilizando innerHTML y funciona correctamente

Funcionaba correctamente al final, no se porque en un principio tuve problemas.

Gracias por la ayuda.