Created
December 5, 2011 15:13
-
-
Save nebiros/1433901 to your computer and use it in GitHub Desktop.
First version of tiny validator that I made with Lopez :)
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* Valida campos usando un objeto, evalua expresiones regulares, si el campo | |
* es requerido o no, mensajes por cada campo, tambien crea un elemento <span> | |
* al lado del campo que tiene errores con el mensaje de error. | |
* | |
* // Ejemplo | |
* var reglas = { | |
* 'elementos': { | |
* 'formPlanillaenlinea:tiposIngresoTemp': { | |
* 'requerido': true, // Puede ser un boolean o un objeto si es necesario evaluar otro campo asociado a este: { 'el': '#formPlanillaenlinea\\:novedadVST', 'selector': ':checked' } | |
* 'expr': { 'regexp': /[a-z]/, // Puede ser un objeto o un string '/[a-z]/', 'valid' : true // Puede ser un boolean o un objeto si es necesario evaluar contra el estado de este: { 'el': '#formPlanillaenlinea\\:novedadVST', 'selector': ':checked' } } | |
* 'mensajes': { | |
* 'requerido': 'Este campo es requerido', | |
* 'expr': 'La expresion regular no puede ser evaluada' | |
* } | |
* } | |
* } | |
* }; | |
* | |
* | |
* var errores = jQuery().validar( reglas ).tieneErrores(); | |
* | |
* if ( true === errores ) { | |
* alert( "Formulario con errores!" ); | |
* } | |
*/ | |
( function ( $ ) { | |
$.extend( $.fn, { | |
validar: function( options ) { | |
var validador = new $.validador( options ); | |
return validador; | |
} | |
} ); | |
$.validador = function ( options ) { | |
if ( 'object' != typeof options || !options.elementos ) { | |
return; | |
} | |
// this.options = $.extend( true, {}, this.defaults, options ); | |
this.options = $.extend( true, {}, $.validador.defaults, options ); | |
this.init(); | |
}; | |
$.extend( $.validador, { | |
defaults: { | |
'mensajes': { | |
'default': 'error', | |
'requerido': 'El campo no puede estar vacío', | |
'expr': 'El campo no cumple con la expresion' | |
}, | |
'elementos': {}, | |
'claseErrores': 'error' | |
}, | |
prototype: { | |
init: function () { | |
// Se eliminan los mensajes de error | |
$( "." + this.options.claseErrores ).remove(); | |
// Se adecuan los ids de los elementos para trabajar con ids de JSF | |
var elementos = this.normalizarElementos( this.options.elementos ); | |
for ( key in elementos ) { | |
var elem = $( "#" + key ); // Soporte para validar ids | |
if( elem.length == 0 ){ | |
var elem = $( "." + key ); // Soporte para validar clases | |
} | |
for( contador = 0; contador < elem.length; contador ++ ){ | |
var el = elem[contador]; | |
// El campo que se va a evaluar nunca debe estar deshabilitado y debe estar visible | |
if ( true === $(el).is( ":enabled" ) ){ | |
// Valida obligatoriedad | |
if ( 'undefined' != typeof elementos[key].requerido ) { | |
// Viene marcado como boolean | |
if ( true === elementos[key].requerido ) { | |
if ( '' == $.trim( $(el).val() ) ) { | |
this.agregarMensaje( el, ( elementos[key].mensajes ? elementos[key].mensajes.requerido : options.mensajes.requerido ) ); | |
this.errores = true; | |
continue; | |
} | |
// Puede que sea un selector, vamos a evaluarlo con is(). | |
} else if ( 'object' == typeof elementos[key].requerido ) { | |
// Pueden venir varios selectores | |
if( $.isArray( elementos[key].requerido.el ) ){ | |
var validar = true; | |
for( idVal in elementos[key].requerido.el ){ | |
if ( false === $( elementos[key].requerido.el[idVal] ).is( elementos[key].requerido.selector[idVal] ) ) { | |
validar = false; | |
continue; | |
} | |
} | |
if ( validar && '' == $.trim( $(el).val() ) ) { | |
this.agregarMensaje( el, ( elementos[key].mensajes ? elementos[key].mensajes.requerido : options.mensajes.requerido ) ); | |
this.errores = true; | |
continue; | |
} | |
}else{ | |
if ( true === $( elementos[key].requerido.el ).is( elementos[key].requerido.selector ) ) { | |
if ( '' == $.trim( $(el).val() ) ) { | |
this.agregarMensaje( el, ( elementos[key].mensajes ? elementos[key].mensajes.requerido : options.mensajes.requerido ) ); | |
this.errores = true; | |
continue; | |
} | |
} | |
} | |
} | |
} | |
// Valida expresiones regulares | |
if ( 'undefined' != typeof elementos[key].expr ) { | |
if ( true === elementos[key].expr.valid ) { | |
if ( false === this.ejecutarExpresion( $.trim( $(el).val() ), elementos[key].expr.regexp ) ) { | |
this.agregarMensaje( el, ( elementos[key].mensajes ? elementos[key].mensajes.expr : options.mensajes.expr + ' ' + elementos[key].expr ) ); | |
this.errores = true; | |
continue; | |
} | |
// Puede que sea un selector, vamos a evaluarlo con is(). | |
}else if ( 'object' == typeof elementos[key].expr.valid ) { | |
if ( true === $( elementos[key].expr.valid.el ).is( elementos[key].expr.valid.selector ) ) { | |
if ( false === this.ejecutarExpresion( $.trim( $(el).val() ), elementos[key].expr.regexp ) ) { | |
this.agregarMensaje( el, ( elementos[key].mensajes ? elementos[key].mensajes.expr : options.mensajes.expr + ' ' + elementos[key].expr ) ); | |
this.errores = true; | |
continue; | |
} | |
} | |
} | |
} | |
// Valida relaciones con otros campos soporta >, >=, <, <=, ===, !== | |
if ( 'undefined' != typeof elementos[key].foreign ) { | |
if ( true === elementos[key].validForeign || ( 'object' == typeof elementos[key].validForeign && true === $( elementos[key].validForeign.el ).is( elementos[key].validForeign.selector ) ) ){ | |
for( id in elementos[key].foreign ){ | |
if ( true === elementos[key].foreign[id].valid || ( 'object' == typeof elementos[key].foreign[id].valid && true === $( elementos[key].foreign[id].valid.el ).is( elementos[key].foreign[id].valid.selector ) ) ){ | |
switch( elementos[key].foreign[id].relation ){ | |
case "===": | |
if( !( $(el).val() * 1 === $( id ).val() * 1 ) ){ | |
this.agregarMensaje( el, ( elementos[key].foreign[id].mensaje ) ); | |
this.errores = true; | |
} | |
break; | |
case "!==": | |
if( !( $(el).val() * 1 !== $( id ).val() * 1 ) ){ | |
this.agregarMensaje( el, ( elementos[key].foreign[id].mensaje ) ); | |
this.errores = true; | |
} | |
break; | |
case ">": | |
if( !( $(el).val() * 1 > $( id ).val() * 1 ) ){ | |
this.agregarMensaje( el, ( elementos[key].foreign[id].mensaje ) ); | |
this.errores = true; | |
} | |
break; | |
case ">=": | |
if( !( $(el).val() * 1 >= $( id ).val() * 1 ) ){ | |
this.agregarMensaje( el, ( elementos[key].foreign[id].mensaje ) ); | |
this.errores = true; | |
} | |
break; | |
case "<": | |
if( !( $(el).val() * 1 < $( id ).val() * 1 ) ){ | |
this.agregarMensaje( el, ( elementos[key].foreign[id].mensaje ) ); | |
this.errores = true; | |
} | |
break; | |
case "<=": | |
if( !( $(el).val() * 1 <= $( id ).val() * 1 ) ){ | |
this.agregarMensaje( el, ( elementos[key].foreign[id].mensaje ) ); | |
this.errores = true; | |
} | |
break; | |
default: | |
break; | |
} | |
} | |
} | |
} | |
} | |
} | |
} | |
} | |
}, | |
errores: false, | |
ejecutarExpresion: function ( text, expr ) { | |
if ( !text || !expr ) { | |
return; | |
} | |
if ( 'undefined' == typeof expr ) { | |
return; | |
} | |
var regex = null; | |
if ( 'object' == typeof expr ) { | |
return expr.test( text ); | |
} else { | |
regex = new RegExp( expr ); | |
return regex.test( text ); | |
} | |
return false; | |
}, | |
normalizarElementos: function ( elementos ) { | |
if ( 'object' != typeof elementos ) { | |
return; | |
} | |
var normalizados = {}; | |
for ( key in elementos ) { | |
normalizados[key.replace( /:/, "\\:" )] = elementos[key]; | |
} | |
return normalizados; | |
}, | |
tieneErrores: function () { | |
return this.errores; | |
}, | |
agregarMensaje: function( element, message ){ | |
$(element).parent().append/*.after*/( '<div class="' + this.options.claseErrores + '">' + ( message ) + '</div>' ); | |
} | |
} | |
} ); | |
} )( jQuery ); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment