Validación de mínimo de caracteres en un campo de entrada

Daniel Muñoz · 7 Nov 2014

Existe algún código para validar que un input tenga un mínimo de caracteres?

Cicklow · 7 Nov 2014

tan simple como buscar en google... HTML input min Attribute

ni que fuera tan dificil... sino con JS y validar el form antes de enviar

Daniel Muñoz · 7 Nov 2014

cicklow dijo:
tan simple como buscar en google... HTML input min Attribute

ni que fuera tan dificil... sino con JS y validar el form antes de enviar

Como valido con JS antes de enviar un form?

Cicklow · 7 Nov 2014

Daniel Muñoz dijo:
Como valido con JS antes de enviar un form?

google: validar formulario javascript

kanikase · 7 Nov 2014

para validar un mínimo de carácteres en el input, usa el atributo onkeydown, con una funcion y ya, porque min no lo soportan todos los navegadores como ie9.

Insertar CODE, HTML o PHP:

<input type="text" id="input" onkeydown="caracteres()">
<script>
function caracteres(){
var input = document.getElementById('input');
if(input.value.length < 15) {
alert('Escribe más de 15 carácteres.');
}
}
</script>

lombervid · 7 Nov 2014

kanikase dijo:
para validar un mínimo de carácteres en el input, usa el atributo onkeydown, con una funcion y ya, porque min no lo soportan todos los navegadores como ie9.

Insertar CODE, HTML o PHP:

<input type="text" id="input" onkeydown="caracteres()"> <script> function caracteres(){ var input = document.getElementById('input'); if(input.value.length < 15) { alert('Escribe más de 15 carácteres.'); } } </script>

Con onkeydown no lo veo muy práctico, ya que te estaría saltando el mensaje a cada rato, yo usaría mejor un onblur o submit del formulario.

kanikase · 7 Nov 2014

lombervid dijo:
Con onkeydown no lo veo muy práctico, ya que te estaría saltando el mensaje a cada rato, yo usaría mejor un onblur o submit del formulario.

Era un ejemplo 🙄 ni modo que le diera el código completo, si ni se lo que tiene 😕 yo lo haría con $('#form').submit()

aperpen · 8 Nov 2014

Es facil, hay dos opciones:
Usando pattern en el input (No es soportado por Safari ni por IE9 o versiones anteriores):

HTML:

<html>
<body>
<form action="">
  <input type="text" pattern=".{5,10}" required>
  <input type="submit">
</form>
</body>
</html>

En ese código por ejemplo si introduces menos de 5 o mas de 10 caracteres te aparecerá esto:

Para cambiar el número de caracteres minimos y máximos donde pone:
{5,10}

Cambias 5 por el numero minimo y 10 por el maximo. O si quieres que solo tenga minimo pones
{5} y cambias el 5 por el numero minimo de caracteres que quieres que tenga tu input.

La otra opcion es por JS:

HTML:

<html>
<head>
<script type="text/javascript">
function validate(){
	if(document.getElementById('minchar').value.length < 5) {
		alert('El campo debe tener al menos 5 carácteres.');
		}else{
		document.getElementById('form').submit();
	}
}
</script>
</head>

<body>

<form id="form">
  <input id="minchar" />
  <input type="button" onClick="validate()" value="Enviar" />
</form>

</body>
</html>

En caso de no tener los 5 caracteres aparecería un alert asi:

Donde dice: < 5
Es donde debes cambiar el 5 por el número minimo de caracteres que quieres que tenga.

Saludos 🙂

Validación de mínimo de caracteres en un campo de entrada

Daniel Muñoz

Cicklow

Daniel Muñoz

Cicklow

kanikase

lombervid

kanikase

aperpen

Temas similares