ejercicio5 finalizado
This commit is contained in:
43
clase-9.js
43
clase-9.js
@@ -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");
|
||||
|
||||
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user