var baseDatos = [];
function ingresarDatos() {
function Persona(nombre, dni, descripcion) { // coloco parámetros del formualrio
this.nombre = document.getElementById("nombre").value;
this.dni = document.getElementById("dni").value;
this.descripcion = document.getElementById("descripcion").value;
}
nuevoUsuario = new Persona(this.nombre, this.dni, this.descripcion);
agregar();
// 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>
}
function agregarEn la función eliminar, utilizo el método .splice() {; como me habían aconsejado, pero hay varias cosas que no entiendo bien.
baseDatos.push(nuevoUsuario);
document.getElementById("datos").innerHTML += '<td>' + nuevoUsuario.nombre + '</td>' + ' ' +
'<td>' + nuevoUsuario.dni + '</td>' + ' ' +
'<td>' + nuevoUsuario.descripcion + '</td>' + ' ' +
'<input type="button" value="Borrar" onclick="elimina()">' + '</br>';
} 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.
function4.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).
baseDatos.pop(nuevoUsuario);
document.getElementById("datos").innerHTML = nuevoUsuario ;
console.log(baseDatos); // Si me funciona correctamente en consola
- Al final de la función arrow, aparece un 1, eso significa que debería eliminar un sólo elemento.?
} Gracias por su ayuda.
- Que debo colocar, para que me elimine sólo el elemento que seleccione al pulsar el botón, y me siga mostrando todo el array en document, sin el elemento ya eliminado.
- Si doy al botón eliminar, me elimina en console, pero en el document no me vuelve a mostrar lo que queda del array.
- He intentado llamando a al array general y/o a la variable global, pero me sobrescribe y no me da datos ingresados anteriormente. No sé, si el método .pop() es el ideal.
- He dejado el código para que se entienda de lo que hablo en js. Muchas gracias