Un poco de historia...
Este validador es el fruto de un trabajo en el que se tenía que validar muchos elementos del formulario, para lo cual busqué un script similar; encontré algunos pero éstos no satisfacían lo que realmente necesitaba, tomando en cuenta el tiempo para entenderlos y adaptarlos, me decidí a implementarlo de acuerdo a lo que necesitaba.
Durante el desarrollo del script aprendí muchas cosas gracias a las visitas continuas a páginas relacionadas y foros e incluso intenté reportar un supuesto bug en Firefox. En agradecimiento a eso, les presento este validador y estoy casi seguro que les ahorrará algo de trabajo, reconozco que tiene muchas limitaciones y/o errores que espero podamos resolverlo...
Características
- Permite la validación de entradas de texto, areas de texto, listas
- Permite el uso de funciones personalizadas
- Permite añadir eventos a elementos usando expresiones regulares (cuando se quiere limitar la entrada de ciertos caracteres)
- Diferentes formas de mostrar los errores
- Permite hacer depuración
- Implementado usando Orientación a Objetos
- Probado en IE6 y Mozilla Firefox
Detalles
El validador está implementado usando el modelo de OO para que pueda ser utilizado en diferentes formularios de una misma página. El script toma los elementos que tengan el atributo title asignado para poder mostrar los mensajes y hacer la validación respectiva. Para usarlo, simplemente basta crear una instancia y configurar algunas propiedades
<script type="text/javascript">
val1 = getInstance('foo');
val1.showSummary = true; // Poniendo esto en false, es un poco molesto
val1.showMessageBox = true;
val1.cssOn = true;
val1.summaryId = 'summary';
</script>
Como se puede observar, se obtiene una instancia a través de la función getInstance, a continuación se asignan las propiedades showSummary, showMessageBox, CssOn y summaryId,
esto indica que los mensajes de error se mostrarán dentro de una lista, utilizando un mensaje de alerta, habilitando el uso de clases CSS y definiendo el contenedor donde se mostrarán los errores, respectivamente. Para mayor detalle publicaré dentro de unos días el listado de propiedades y funciones, mientras tanto pueden estar viendo el código fuente 🙂
Una de las cosas en la que quiero refinar el trabajo es la utilización de funciones personalizadas, haciendo que estas puedan ser integradas con el validador, en esta versión se presenta una algo básico de esta funcionalidad usando la siguiente sintáxis "val1.addCustomFunction('email','checkEmail');", donde la función checkEmail, recibe como parámetro (esta versión sólo permite el paso de un parámetro que es el valor del control a la que se asocia la función) una cadena y se asocia al elemento a validar, dicha función devuelve "verdadero" o "falso"
Para mayores detalles con la utilización remito al lector descargar el ejemplo o ver el funcionamiento
de éste en la página de prueba.
Conclusiones
Es importante la validación en el lado del cliente para acelerar este tipo de cosas
rutinarias, pero estamos sujetos a la voluntad del cliente. Por eso es necesario hacer la validación de los datos en el lado servidor también, para evitar incoherencias en los datos.
One reply on “BuayaCorp Forms Validator”
Se ve excelente, gracias por tu aporte, bendecido seas, lo probaré.