Bueno trataba de crear una tabla por medio de `js` en donde aparecería (id, nombre, apellido, email, edad, dni, telefono) pero cuando ingreso los `input` y llamo los datos obtenidos solo me repite la misma cosa que deje como encabezado. Este es mi index (algunas `id` y `class` no llevan a nada ya que luego le aplicare `css`) ``` <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> </head> <body> <div class="centrarFormulario"> <form id="formulario"> <label for="nombre">Nombre:</label> <input id="nombre" type="text" placeholder="Ingrese su nombre" /> <label for="apellido">Apellido:</label> <input id="apellido" type="text" placeholder="Ingrese su apellido" /> <label for="email">email:</label> <input id="email" type="email" placeholder="Ingrese su email" /> <label for="edad">Edad:</label> <input id="edad" type="number" placeholder="Ingrese su Edad" /> <label for="id">Id:</label> <input id="id" type="number" placeholder="Ingrese su n° de cliente en orden" /> <label for="dni">dni:</label> <input id="dni" type="number" placeholder="Ingrese su DNI" /> <label for="telefono">Telefono:</label> <input id="telefono" type="number" placeholder="Ingrese su Telefono" /> <label for="calle">Dirección:</label> <input id="Dirección" type="text" placeholder="Ingrese su Dirección" /> <h3>Ingrese los datos del pedido</h3> <label for="asistencia">Cantidad de ingresantes:</label> <input id="ingresantes" type="text" placeholder="Ingrese la cantidad" /> <label for="aplicantes">cantidad de ancianos y menores:</label> <input id="aplicantes" type="text" placeholder="Ingrese la cantidad" /> <button id="btnLoad" type="submit">Enviar</button> <button type="reset">Restablecer</button> </form> </div> <script src="./js/main.js"></script> </body> </html> ``` y este mi `js` ``` $(document).ready(function () { $("#btnLoad").click(function () { console.log($("#nombre").val()); console.log($("#apellido").val()); console.log($("#email").val()); console.log($("#edad").val()); console.log($("#id").val()); console.log($("#dni").val()); console.log($("#telefono").val()); console.log($("#ingresantes").val()); console.log($("#aplicantes").val()); const form = $("#formulario"); const inputName = $("#nombre"); const inputSurname = $("#apellido"); const inputEmail = $("#email"); const inputAge = $("#edad"); const inputId = $("#id"); const inputDni = $("#dni"); const inputPhone = $("#telefono"); // pronto usare esto para dar resultados sobre la compra de boletos // const inputIncoming = $("#ingresantes"); // const inputApplicants = $("#aplicantes"); //--------------------------------------------------------------- function User(id, nombre, apellido, email, edad, dni, telefono) { this.id = id; this.nombre = nombre; this.apellido = apellido; this.email = email; this.edad = edad; this.id = id; this.dni = dni; this.telefono = telefono; } let listUser = []; listUser = getUserFromStorage("users") || []; function saveToStorage(key, user) { listUser.push(user); localStorage.setItem(key, JSON.stringify(listUser)); } function getUserFromStorage(key) { if (localStorage.getItem(key)) { return JSON.parse(localStorage.getItem(key)); } } function createTable(element, id) { const table = `<table id=${id} class="tabla"></table>`; $(element).append(table); } function createDataHeader(data) { return data.map((headerData) => `<th> ${headerData} </th>`); } function createTableHeader(data, table) { const header = `<tr> ${createDataHeader(data)} </tr>`; $(table).append(header); } function populateTableData( id, nombre, apellido, email, edad, dni, telefono ) { return `<td class="celdas"> ${id} </td> <td class="celdas"> ${nombre} </td> <td class="celdas"> ${apellido} </td> <td class="celdas"> ${email} </td> <td class="celdas"> ${edad} </td> <td class="celdas"> ${dni} </td> <td class="celdas"> ${telefono} </td>`; } function createRowUser(user, element) { const row = `<tr id="tr-${user.id}"> ${populateTableData( user.id, user.nombre, user.apellido, user.email, user.edad, user.dni, user.telefono )} </tr>`; } function populateRows(data, element) { data.map((user) => { createRowUser(user, element); }); } if (localStorage.getItem("users")) { createTable("body", "user-table"); createTableHeader( ["id", "nombre", "apellido", "email", "edad", "dni", "telefono"], "#user-table" ); populateRows(getUserFromStorage("users"), "#user-table"); } form.submit(function (event) { event.preventDefault(); const id = inputId.val(); const nombre = inputName.val(); const apellido = inputSurname.val(); const email = inputEmail.val(); const edad = inputAge.val(); const dni = inputDni.val(); const telefono = inputPhone.val(); const user = new User(nombre, apellido, email, edad, id, dni, telefono); if (!localStorage.getItem("users")) { createTable("body", "user-table"); createTableHeader([ "id", "nombre", "apellido", "email", "edad", "dni", "telefono", ]); saveToStorage("users", user); createRowUser(user, "#user-table"); } }); }); }); ``` Realmente me estoy quedando sin tiempo, he intentado resolver esto por casi 1 mes he preguntado a gente que sabe del tema y no supo ayudarme, la verdad ya no se que hacer.