Estoy desarrollando una serie de validaciones para unos formularios que tengo en mi aplicacion, he encontrado el siguiente js en internet y trato de modificarlo:
Código PHP:
$(document).ready(function(){
// ====================================================== //
var jVal = {
'login' : function() {
$('body').append('<div id="loginInfo" class="info"></div>');
var loginInfo = $('#loginInfo');
var ele = $('#login');
var pos = ele.offset();
loginInfo.css({
top: pos.top-3,
left: pos.left+ele.width()+15
});
if(ele.val().length == 0) {
jVal.errors = true;
loginInfo.removeClass('correct').addClass('error').html('← No puede estar vacio').show();
ele.removeClass('normal').addClass('wrong');
} else {
if(ele.val().length > 5) {
jVal.errors = true;
loginInfo.removeClass('correct').addClass('error').html('← MAx 5 caracteres').show();
ele.removeClass('normal').addClass('wrong');
} else {
loginInfo.removeClass('error').addClass('correct').html('').show();
ele.removeClass('wrong').addClass('normal');
}
}
},
'password' : function() {
$('body').append('<div id="passwordInfo" class="info"></div>');
var passwordInfo = $('#passwordInfo');
var ele = $('#password');
var pos = ele.offset();
passwordInfo.css({
top: pos.top-3,
left: pos.left+ele.width()+15
});
if(ele.val().length == 0) {
jVal.errors = true;
passwordInfo.removeClass('correct').addClass('error').html('← No puede estar vacio').show();
ele.removeClass('normal').addClass('wrong');
} else {
if(ele.val().length > 5) {
jVal.errors = true;
passwordInfo.removeClass('correct').addClass('error').html('← MAx 5 caracteres').show();
ele.removeClass('normal').addClass('wrong');
} else {
passwordInfo.removeClass('error').addClass('correct').html('').show();
ele.removeClass('wrong').addClass('normal');
}
}
},
'nombre' : function() {
$('body').append('<div id="nombreInfo" class="info"></div>');
var nombreInfo = $('#nombreInfo');
var ele = $('#nombre');
var pos = ele.offset();
nombreInfo.css({
top: pos.top-3,
left: pos.left+ele.width()+15
});
if(ele.val().length == 0) {
jVal.errors = true;
nombreInfo.removeClass('correct').addClass('error').html('← No puede estar vacio').show();
ele.removeClass('normal').addClass('wrong');
} else {
if(ele.val().length > 5) {
jVal.errors = true;
nombreInfo.removeClass('correct').addClass('error').html('← MAx 5 caracteres').show();
ele.removeClass('normal').addClass('wrong');
} else {
nombreInfo.removeClass('error').addClass('correct').html('').show();
ele.removeClass('wrong').addClass('normal');
}
}
},
'sendIt' : function (){
if(!jVal.errors) {
$('#jform').submit();
}
}
};
// ====================================================== //
$('#send').click(function (){
var obj = $.browser.webkit ? $('body') : $('html');
obj.animate({ scrollTop: $('#jform').offset().top }, 750, function (){
jVal.errors = false;
jVal.login();
jVal.password();
jVal.nombre();
});
return false;
});
$('#login').change(jVal.login);
$('#password').change(jVal.password);
$('#nombre').change(jVal.nombre);
// ====================================================== //
});
En el caso de que tenga un primer formulario en el que solo aparezcan los campos login y password a validar ( nombre no, aparece en otro formulario) al pulsar el boton submit no me deja continuar xq ese campo "nombre" al no aparecer en ese formulario da un error ( el error viene de ahi, xq si comento todo lo relativo a "nombre" funciona bien)
Una posible solucion seria crear un archivo javascript diferente para cada formulario, contiendo solo las variables que aparecen en ese formulario, pero prefiero evitar esto y asi no tener 10 u 11 archivos .js para las validaciones.
Que pensais?