avances en el js de ejercicio5

clase-9.js

@@ -93,3 +93,28 @@ boton.addEventListener('click' , () =>{
 // Para limpiar un campo se puede asignar un string vacío a su propiedad value:
 
 // document.querySelector("#nombre").value = "";
+
+let nombre  = document.querySelector('#nombre');
+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) =>{
+    e.preventDefault();
+    if (nombre.value.trim() === '') {
+        console.log('nombre vacio, reintenta');
+        return;
+    } else if (edad.value > 120 || edad.value < 0){
+        console.log('edad inverosimil');
+        return;
+    } else if (mensaje.value.trim() === ''){
+        console.log('mensaje vacio');
+        return;
+    }
+
+
+    console.log("Formulario enviado");
+});

index.html

@@ -45,7 +45,7 @@
         <hr>
         <div id="ejercicio-5">
             <!-- Agregar acá el código HTML que haga falta para el ejercicio 5 -->
-             <form action="" method="get">
+             <form>
                 <label for="nombre">Nombre</label> 
                 <input type="text" name="nombre" id="nombre">
                 <br>
@@ -54,7 +54,7 @@
                 <br>
                 <label for="mensaje">Mensaje</label>
                 <textarea name="mensaje" id="mensaje"></textarea>
-                <button type="submit">enviar</button>
+                <button type="submit" id="enviar">enviar</button>
              </form>
         </div>
         <script src="clase-9.js"></script>