feat: implement user form with validation for username, age, and password

2026-05-25 12:42:12 -03:00
parent 8000f59a2c
commit 894fbf39d3
2 changed files with 32 additions and 1 deletions
--- a/ejercicio7/ejercicio7.js
+++ b/ejercicio7/ejercicio7.js
@@ -1 +1,24 @@
 // Agregar aquí el código javascript
+
+const userForm = document.getElementById('userForm');
+
+userForm.addEventListener('submit', (event) => {
+    event.preventDefault();
+    const username = document.getElementById('username').value.trim();
+    const age = parseInt(document.getElementById('age').value);
+    const password = document.getElementById('password').value;
+    if (username === '') {
+        alert('El nombre de usuario no puede estar vacío.');
+        return;
+    }
+    if (isNaN(age) || age < 0 || age > 100) {
+        alert('La edad debe ser un número válido entre 0 y 100.');
+        return;
+    }
+    if (password.length < 8) {
+        alert('La contraseña debe tener al menos 8 caracteres.');
+        return;
+    }
+    alert('Formulario enviado correctamente.');
+    userForm.reset();
+});
--- a/ejercicio7/index.html
+++ b/ejercicio7/index.html
@@ -8,7 +8,15 @@
    </head>
    <body>
        <h1>Ejercicio 7</h1>
-
+        <form id="userForm">
+            <label for="username">Nombre de usuario:</label>
+            <input type="text" id="username" name="username" required>
+            <label for="age">Edad:</label>
+            <input type="number" id="age" name="age" required>
+            <label for="password">Contraseña:</label>
+            <input type="password" id="password" name="password" required>
+            <button type="submit">Enviar</button>
+        </form>
        <script src="ejercicio7.js"></script>
    </body>
 </html>