
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
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


0