LiveValidation, validación de campos con Ajax
LiveValidation es una utilidad en Javascript que permite validar los campos o entradas de textos de los formularios HTML (textarea, input text, input check) en tiempo real. Tiene interesantes características:
- Verifica que un campo no esté vacio.
- Verifica que el texto ingresado corresponda a uno determinado. Si usted exige que el usuario escriba "hola" entonces el validador actuará en función de ello, independientemente de si es con mayúsculas o minúsculas.
- Verifica que cierta palabra aparezca en una expresion ingresada.
- Verifica que el texto ingresado solo contenga números, números enteros ó un número específico.
- Verifica que el texto ingresado solo contenga números, pero que éste sea mayor ó menor que cierto valor, ó también verifica que el número corresponda a un valor entre un rango específico.
- Verifica la longitud de caracteres del texto ingresado, puede ser mayor ó menor a cierto valor específico, ó corresponda a un rango específico.
- Verifica que ciertas expresiones ó texto este incluido ó excluido del texto ingresado.
- Verifica que un checkbox este clickeado ó no.
- Verifica que contraseña y confirmanción coincidan (por ejemplo para un formulario de registro.)
- Verifica la estructura de un e-mail (tunickname@servidor.xxx)
- Finalmente todo lo descrito anteriormente lo puede combinar para obtener un validador avanzado.
- Entre otras características muy interesantes.
Cómo usarlo
En la parte del head, agrega el archivo javascript, esto dependerá del tipo de archivo que descarges... en este caso usamos en standalone.
<script type="text/javascript" src="livevalidation_standalone.compressed.js"></script>
Luego dentro del body en los campos ó entradas de texto que desees validar, llama a los métodos necesarios. En este ejemplo estamos validando que el campo cuyo id "f1" no quede en blanco.
<input id="f1" type="text">
<script type="text/javascript">
var f1 = new LiveValidation('f1');
f1.add(Validate.Presence);
</script>
En la sección ejemplos del LiveValidation puede encontrar otras formas de uso.
Enlaces | LiveValidation, Documentación
Comentarios
en el ejemplo 1
tengo declarado mi formulario asi
<form name="frmnuevo" action="" onSubmit="enviardatos(); return false">
y mi boton submit asi
<input type="submit" name="Submit" value="Guardar" />
FUNCIONA PERFECTAMENTE!!!
en el ejemplo 2
tengo declarado mi formulario asi
<form style="padding-right:20px;" id="form_Abc">
y mi boton submit asi
<input type="button" value="Agregar" onClick="document.getElementById('Id_funcion').value='ALTAS';enviaform()">
asi un baton para cadaa tipo de funcion abc
me cacha los errores pero al dar submit me deja pasar y guardar con errores
soy nuevo en esto no se si puedas ayudarme
y mi segunda pregunta como valido para escribir puras mayusculas se puede en la libreria no me funciona
saludos
Pegale un vistazo a esto:
http://livevalidation.com/documentation
y a esto
http://livevalidation.com/examples
recordad que todos las "normas" añadidas con livevalidation van entre etiquetas <script></script>
En respuesta a irMary puedes modificar los mensajes en ingles buscandolos en el .js para definir mensajes genericos, aunque también puedes definir un error diferente para cada <input>,<select>...
ejemplo.(campo no puede estar vacio con texto personalizado):
<script type="text/javascript">
nombre_input.add(Validate.Presence, {failureMessage: "Hey no puedo estar vacio! llename o el texto que tu quieras"});
</script>
Espero que os haya servido de ayuda cualquier cosita comentadme por email!
Saludos!
Ya cambie los dos js pero no se de donde saca los mensajes.
Muchas gracias
Dejar un comentario