0
267
Vistas¿Por qué el valor del campo de entrada no se muestra en la tabla?
Estoy haciendo una tabla HTML dinámica usando JavaScript, a la que puedes agregar nombres y apellidos. Pero cuando hago clic en el botón Enviar, crea celdas vacías sin un valor de campo de entrada.
HTML
<input type="text" id="name" placeholder="First Name"> <input type="text" id="lastname" placeholder="Last Name"> <input type="button" id ="submit" value="Submit" > <table border="1" id="table"> <tr> <th>First Name</th> <th>Last Name</th> </tr> </table>JavaScript
let name = document.getElementById("name").value; let lastname = document.getElementById("lastname").value; let submit = document.getElementById("submit"); let table = document.getElementById("table"); var rowNum = 1; submit.addEventListener("click" , function(){ var row = table.insertRow(rowNum); var cell0 = row.insertCell(0); var cell1 = row.insertCell(1); cell0.innerHTML = name; cell1.innerHTML = lastname; rowNum++; }); 
·
Juan Pablo Isaza
1 Respuestas
Responde la pregunta0
Debe obtener el valor de las inputs después del submit , no en la carga inicial del script , ya que los valores serán solo una cadena vacía en la carga inicial del script.
Solo necesita agregar variables de name y lastname dentro del alcance del detector de eventos de click .
let submit = document.getElementById("submit"); let table = document.getElementById("table"); var rowNum = 1; submit.addEventListener("click" , function(){ let name = document.getElementById("name").value; let lastname = document.getElementById("lastname").value; var row = table.insertRow(rowNum); var cell0 = row.insertCell(0); var cell1 = row.insertCell(1); cell0.innerHTML = name; cell1.innerHTML = lastname; rowNum++; }); <input type="text" id="name" placeholder="First Name"> <input type="text" id="lastname" placeholder="Last Name"> <input type="button" id ="submit" value="Submit" > <table border="1" id="table"> <tr> <th>First Name</th> <th>Last Name</th> </tr> </table>
·
Juan Pablo Isaza
Denunciar
Responde la pregunta