Bom dia a todos,
Em minhas aventuras com o framework JQuery, acabei tendo que fazer uma função para validar um formulário razoávelmente grande, ou seja, muitos campos (textareas, selects, radio, inputs text,...etc). Para esse caso resolvi fazer uma função javascript para que me agilizasse o trabalho, logo em algumas lidas pela Internet, acabei utilizando a função each, que acabou sendo de grande utilidade.
Como estava utilizando o JQuery dentro do Joomla! que por padrão vem com o Mootools junto, deixei o JQuery rodando em modo de compatibilidade (Noconflicts), assim declarei ele para a seguinte variável.
var j = jQuery.noConflict();
Dessa maneira eu poderia acessar as funções do JQuery através da variável j.
Como sempre trabalho com Javascript orientado a objetos, criei uma classe simples, chamada Validacao(), logo a sua declaração junto com a função de validação segue abaixo.
function Validacao()
{
this.validacao_formulario_submit = function ()
{
var inputs = j('#ChronoContact_cadastro-egresso :input');
var can = true;
inputs.each (function (i, elemento)
{
if(elemento.accept && elemento.value === '')
{
if(elemento.valor_negado != null || elemento.valor_negado != undefined)
{
if(elemento.value == elemento.valor_negado)
{
can = false;
alert(elemento.accept);
return false;
}
}
else
{
if(elemento.value == '')
{
can = false;
alert(elemento.accept);
return false;
}
}
}
});
return can;
};
};
Nos campos do formulário, eu adicionei a tag 'accept' e pelo Javascript, eu verifico se o campo possui essa tag, caso o mesmo tenha e o seu valor esteja em branco, eu imprimo um alert e cancelo o submit do formulário.
Na declaração dos campos do formulário, segui um padrão para que a função Javascript funcionasse legal, para isso utilizei algumas regras simples, como:
-
Os campos com o atributo disabled não necessitavam de validação;
-
Para os campos requeridos, adicionei a tag accept, e o valor dessa tag era a mensagem que é exibida pela função javascript na hora da validação;
-
Para os combobox adicionei uma tag própria, ou seja, que eu mesmo criei, a tag valor_negado, assim o combobox tem N valores para o usuário escolher, mas ele não pode escolher um determinado valor, como por exemplo o item que tem 'Escolha um Estado Civil' que tem o seu value como 'S';
-
Toda a vez que a função encontra um item que precise ser preenchido ou selecionado, um alert é exibido e a borda do campo é pintada para vermelha e é dado foco para o mesmo;
