routaboul.romeo/clase-11-ejercicio-integrador
1
0
Fork 0
forked from marquez.juan/clase-11-ejercicio-integrador
Code Pull Requests Activity

ejercicio 2 correciones

Browse Source
This commit is contained in:
Romeo
2026-06-01 22:56:50 -03:00
parent 1291db3fac
commit 928ddba87e
1 changed files with 22 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
script.js
View File

@@ -5,9 +5,11 @@ let libros = [
{ titulo: "La inquietud del rosal", anio: 1916, puntaje: 8, autor: "Alfonsina Storni" }, { titulo: "La inquietud del rosal", anio: 1916, puntaje: 8, autor: "Alfonsina Storni" },
]; ];
function mostrarTabla(libros) {
//asignamos el tbody a una variable (para usarla mas tarde) //asignamos el tbody a una variable (para usarla mas tarde)
let tableBody = document.querySelector("tbody") let tableBody = document.querySelector("tbody")
tableBody.textContent = "" // vaciamos la tabla para sacar los libros del famoso fulano
function mostrarTabla(libros) {
//iteramos la lista con un for of //iteramos la lista con un for of
for (libro of libros){ // por cada libro en libros: for (libro of libros){ // por cada libro en libros:
// creamos 1 row y 4 td // creamos 1 row y 4 td
@@ -29,41 +31,33 @@ function mostrarTabla(libros) {
nuevoRow.appendChild(tdPuntaje); nuevoRow.appendChild(tdPuntaje);
} }
} }
// Invocamos la función al inicio para poblar la tabla con los datos del array
mostrarTabla(libros); mostrarTabla(libros);
// Invocamos la función al inicio para poblar la tabla con los datos del array
// ejercicio 2 // ejercicio 2
// creamos las variables pertinentes para fabricar la funcion // creamos las variables
let botonAgregar = document.querySelector("#boton-agregar"); let botonAgregar = document.querySelector("#boton-agregar");
let inputTitulo = document.querySelector("#titulo"); let inputTitulo = document.querySelector("#titulo");
let inputAutor = document.querySelector("#autor"); let inputAutor = document.querySelector("#autor");
let inputAnio = document.querySelector("#anio"); let inputAnio = document.querySelector("#anio");
let inputCalificacion = document.querySelector("#calificacion"); let inputCalificacion = document.querySelector("#calificacion");
// Generamos el listener en boton-agregar // Generamos el listener en boton-agregar que hara lo siguiente
botonAgregar.addEventListener("click",(n)=>{ botonAgregar.addEventListener("click",(n)=>{
tableBody.textContent = ""; // borramos la tabla cada vez que ejecutamos el listener para estar evitar repetir la lista cada vez que se acciona
if (inputTitulo.value === "" || inputAutor.value === "" || inputAnio.value === "" || inputCalificacion.value === ""){ // si alguno de los campos esta vacio... if (inputTitulo.value === "" || inputAutor.value === "" || inputAnio.value === "" || inputCalificacion.value === ""){ // si alguno de los campos esta vacio...
alert("Ningun campo puede estar vacio"); // mensaje de error alert("Ningun campo puede estar vacio"); // mensaje de error
} else if (parseInt(inputCalificacion.value) < 0 || parseInt(inputCalificacion.value) > 10){ // si todos los campos estan llenos, pero la calificacion no esta entre 0 y 10 ... } else if (parseInt(inputCalificacion.value) < 0 || parseInt(inputCalificacion.value) > 10){ // si todos los campos estan llenos, pero la calificacion no esta entre 0 y 10 ...
alert("el puntaje tiene que ser del 1 al 10"); // mensaje de error alert("el puntaje tiene que ser del 1 al 10"); // mensaje de error
} else { // si llegamos hasta aqui es porque el codigo no presenta errores, por lo tanto reciclamos un poco del codigo del ejercicio anterior para crear elementos a la tabla } else {
// por cada libro creado en el formulario... libros.push( { titulo : inputTitulo.value , anio : inputAnio.value , puntaje : inputCalificacion.value , autor : inputAutor.value }); // si no hay errores pusheamos el nuevo objeto al array
// creamos 1 row y 4 td alert("Libro añadido con exito"); // mensaje de exito
let tableBody = document.querySelector("tbody"); inputTitulo.value = ""
let nuevoRow = document.createElement("tr"); inputAutor.value = ""
let tdTitulo = document.createElement("td"); inputAnio.value = ""
let tdAutor = document.createElement("td"); inputCalificacion.value = ""
let tdAnio = document.createElement("td");
let tdPuntaje = document.createElement("td");
//la llenamos con el contenido correspondiente
tdTitulo.textContent = inputTitulo.value;
tdAutor.textContent = inputAutor.value;
tdAnio.textContent = inputAnio.value;
tdPuntaje.textContent = inputCalificacion.value;
// y las anexamos a la tabla html de forma correspondiente
tableBody.appendChild(nuevoRow);
nuevoRow.appendChild(tdTitulo);
nuevoRow.appendChild(tdAutor);
nuevoRow.appendChild(tdAnio);
nuevoRow.appendChild(tdPuntaje);
} }
mostrarTabla(libros);
}) })