marquez.juan/clase-9-eventos
1
0
Fork 16
Code Issues Pull Requests 10 Projects Releases Wiki Activity

Ejercicios de la clase 9 #6

Open
routaboul.romeo wants to merge 8 commits from routaboul.romeo/clase-9-eventos:rama-b into main
pull from: routaboul.romeo/clase-9-eventos:rama-b
merge into: marquez.juan:main
Conversation 0 Commits 8 Files Changed 2 +29 -14
1 changed files with 29 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit f490f4e3d9 - Show all commits

43
clase-9.js
View File

@@ -94,28 +94,43 @@ boton.addEventListener('click' , () =>{
// document.querySelector("#nombre").value = "";
let nombre = document.querySelector('#nombre');
let nombre = document.querySelector('#nombre'); // almacenamos en variables los elementos html que necesitamos
let edad = document.querySelector('#edad');
let mensaje = document.querySelector('textarea');
let enviar = document.querySelector('#enviar');
let form = document.querySelector('form')
console.log(nombre.value);
form.addEventListener('submit' , (e) =>{
form.addEventListener('submit' , (e) =>{ //creamos el listener previniendo el refresh de la pagina
e.preventDefault();
if (nombre.value.trim() === '') {
console.log('nombre vacio, reintenta');
document.querySelector('#error-nombre').textContent = 'error nombre';
return;
} else if (edad.value > 120 || edad.value < 0){
console.log('edad inverosimil');
return;
} else if (mensaje.value.trim() === ''){
console.log('mensaje vacio');
if (nombre.value.trim() === '') { //si el nombre esta vacio => mensaje error
document.querySelector('#error-nombre').textContent = 'El nombre no puede estar vacio';
} else if (edad.value > 120 || edad.value < 0 || edad.value === ""){ // en este else if recibimos todos los errores para despues desglosarlo
if(edad.value > 120 || edad.value < 0){ // si: el numero es negativo o mayor a 120 => "edad invalida"
document.querySelector('#error-edad').textContent = 'edad invalida';
}
else if (edad.value === ""){ // si la edad esta vacia => error
document.querySelector('#error-edad').textContent = 'El campo "edad" no puede estar vacio';
}
} else if (mensaje.value.trim() === ''){ // si el mensaje esta vacio => error
document.querySelector('#error-mensaje').textContent = 'El mensaje no puede estar vacio';
}
if (!(nombre.value.trim() === '' || edad.value > 120 || edad.value < 0 || edad.value === "" || mensaje.value.trim() === '')){ // Si se umplen TODAS las condiciones neesarias => "formulario enviaro"
alert("Formulario enviado");
document.querySelector("#nombre").value = ""; // borramos todos los valores en blanco al recibir el mensaje de envio de formulario
document.querySelector("#error-nombre").textContent = "";
document.querySelector("#edad").value = "";
document.querySelector("#error-edad").textContent = "";
document.querySelector("#mensaje").value = "";
document.querySelector("#error-mensaje").textContent = "";
return;
}
console.log("Formulario enviado");
});