Solucionado (ver solución)
Solucionado
(ver solución)
1
respuesta

Lo aprendido!!!

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

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

    var form = document.querySelector("#form-adicionar") // ahora creamos la variable form para llamar al id creado en el formulario del html

    var nombre = form.nombre.value; // lo que se hizo fue crear 4 variables, para que accedan al valor de los objetos dentro de los formularios
    var peso = form.peso.value;
    var altura = form.altura.value;
    var gordura = form.gordura.value;

    var tabla = document.querySelector("#tabla-pacientes"); // con esta linea se llama al id del tbody relacionandolo a la variable tabla    

    // ahora lo que necesitamos es crear la fila con los campos correspondientes a lo valores que se ingresen 
    // para eso necesitamos etiquetas tr(general que contendra a las demas) y etiquetas td(son los campos a ser llenados con los valores ingresados)

    pacienteTr = document.createElement("tr");
    nombreTd = document.createElement("td");
    pesoTd = document.createElement("td");
    alturaTd = document.createElement("td");
    gorduraTd = document.createElement("td");
    imcTd = document.createElement("td");

    // ahora tenemos que acceder a los valores que se carguen en la variables y relacionarlas con las etiquetas td nuevas

    nombreTd.textContent = nombre; // aca le decimos q la etiqueta nombreTd acceda a su contenido de text que sera igual a lo ingresado en la varibale nombre
    pesoTd.textContent = peso;
    alturaTd.textContent = altura;
    gorduraTd.textContent = gordura;

    // lo que hacemos aca es crear la adopcion por parte de paciente de las etiquetas td a traves del metodo appendChild

    pacienteTr.appendChild(nombreTd);
    pacienteTr.appendChild(pesoTd);
    pacienteTr.appendChild(alturaTd);
    pacienteTr.appendChild(gorduraTd);

    tabla.appendChild(pacienteTr); // con esta linea lo que hacemos es decirle a la tabla que nos adopte al pacienteTr creado anteriormente



}); 
1 respuesta
solución!

Hola Marcos

Gracias por compartir tu código, está muy bien felicitaciones.

Si tienes alguna pregunta sobre el contenido de los cursos, estaremos aquí para ayudarte.

Si este post te ayudó, por favor, marca como solucionado ✓. Continúa con tus estudios