JavaScript - VALIDAR FORMULARIO JAVASCRIPT Y HTML

 
Vista:
sin imagen de perfil

VALIDAR FORMULARIO JAVASCRIPT Y HTML

Publicado por Miriam (6 intervenciones) el 01/05/2022 22:40:05
Hola!!

Estoy haciendo un ejercicio pero no consigo validar y enviar un formulario.

Tengo este código HTML, al cual no puedo añadir ni modificar nada:

</head>
<body>
<h1>Juego de cartas</h1>

<p>
<label>Introduce el nombre del participante</label
><input type="text" name="nombre" />
</p>
<p>
<label>¿Cuántas partidas quieres jugar? </label
><input type="number" name="partidas" value="0" />
</p>
<button>¡PARTICIPAR!</button>

<script type="text/javascript" src="piedraPapelTijera.js"></script>
</body>

Estoy intentando validar el formulario, el cual debe poner los campos en rojo cuando le de al botón participar y no cumpla las condiciones de validación. Una vez corregidos los datos y validado el formulario los campos deben desactivarse para que no se puedan escribir otra vez y quedarse visuales.

He realizado esto pero no consigo mi objetivo:

function validarNombre() {
const nombre = document.getElementsByName("nombre");
const expresion1 = /[A-Za-z]{3,}/;
nombre.click();

if (!expresion1.test(nombre.value)) {
nombre.classList.add("fondoRojo");
return false;
}
return true;
}

function validarPartidas() {
partidas.click();
const partidas = document.getElementsByName("partidas");
if (partidas.value <= 0) {
partidas.classList.add("fondoRojo");
return false;
}
return true;
}

// Indico quién lanza los eventos
document
.getElementsByTagName("button")[0]
.addEventListener("click", validarNombre);

document
.getElementsByTagName("button")[0]
.addEventListener("click", validarPartidas);

Muchas gracias
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder