// variables tipo array vacías
nombres = [];
dni = [];
descripciones = [];
//variable creada para que me funcione el eliminar
const nuevoID = (() => {
let id = 0;
return () => id++;
})();
// función para darle utilidad al botón
function ingresa() {
var nombrePrueba = document.getElementById("nombre").value;
var dniPrueba = document.getElementById("dni").value;
var descripcionPrueba = document.getElementById("descripcion").value;
if (nombrePrueba == "", dniPrueba == "", descripcionPrueba == "") {
alert("Completa tus datos, gracias.");
} else if (!dniComprueba(dniPrueba)) {
nombres.push(nombrePrueba);
dni.push(dniPrueba);
descripciones.push(descripcionPrueba);
document.getElementById("datos").innerHTML +=
'<td>' + nombrePrueba + '</td>' + ' ' +
'<td>' + dniPrueba + '</td>' + ' ' +
'<td>' + descripcionPrueba + '</td>' + ' ' +
'<input type="button" value="Borrar" onclick="elimina()">' + '<br>';
} else {
alert("Ya existe el dni");
}
}
//me comprueba un dato específico, para no duplicar
function dniComprueba(dniPrueba) {
var compruebaDni = dni.find(element => element === dniPrueba);
if (compruebaDni) {
return true;
} else {
return false;
}
}
// no comprendo bien, del significado de ésta función,
function elimina() {
// no entiendo bien esta parte. donde llamo a un item.
dni.splice(dni.findIndex((item) => item.id === item.id), 1); // no me queda clara la estructura
document.getElementById("datos").remove(); // aquí me borra todos los datos, no solo una línea
}
<!DOCTYPE html>
<html lang="es">
<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>Probando </title>
<script src="form6_3Arrays.js"></script>
</head>
<body>
<h1>Base de datos</h1>
<form value="">
<input type="text" id="nombre" placeholder="Nombre" autofocus>
<input type="text" id="dni" placeholder="dni">
<input type="text" id="descripcion" placeholder="Descripcion">
<input type="button" value="Agregar" onclick="ingresa()">
</form>
<div id="datos"> </div>
</body>
</html>
En la función eliminar, utilizo el método .splice(); como me habían aconsejado, pero hay varias cosas que no entiendo bien.
1.El por qué crear esa constante al principio para que genere id's. ¿Los genera con cada propiedad del array.? Si son 3 arrays, ¿Engloba.?
Aún, siendo 3 arrays vacíos, ¿crea id por cada línea?
En la función elimina(), busca un elemento llamado ítem, ¿pero de donde sale esa relación? Se denomina a medida que ingreso un dato.? Se crea automático.
4.Cuando ejecuto la función, me elimina todo lo del documento, entiendo que es porque se le llama a la función remove(), con la referencia que id que me llama del document y es masivo, pero no encuentro como hacer que me borre sólo la línea en la que le de el click al eliminar. (me lo hace borrado global).
- Al final de la función arrow, aparece un 1, eso significa que debería eliminar un sólo elemento.?
Gracias por su ayuda.