Como validar formulários facilmente com Vanadium

Vanadium é um plugin para jQuery que permite validar formulários de maneira simples e com poucas linhas de código. Permite validar campos obrigatórios, numéricos, email e outros.

Validar formulários é muito importa no desenvolvimento web, pois previne-se a inserção de dados inválidos ou em formato inadequado.

Obivamente estas validações devem vir acompanhadas de uma validação do lado do servidor para ter uma dupla proteção. Veja como utilizar do lado do cliente a biblioteca Vanadium para validar seus formulários.

Como utilizar o Vanadium
A primeira coisa a fazer é baixar o script do site oficial (), pode-se escolher qualquer versão: vanadium.js contém comentários que podem ser utilizados para edita. O vanadium-min.js é o mesmo script, porém de forma comprimida para acelerar o carregamento.

O próximo passo é incluir a biblioteca Jquery (eu prefiro utilizar o Jquery diretamente do Google AJAX Libraries API), e Vanadium diretamente em sua página, dentro das tags Head, para fazer uso de seus métodos.

  1. <scripttype=“text/javascript”src=“http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js”></script>
  2. <scripttype=“text/javascript”src=“vanadium.js”></script>

Agora é so adicionar diretamente nos campos de nosso formulário, o tipo de validação que queremos aplicar, isso é fácil fazer através do uso de classes de estilos. Alguns dos tipos de validações:

  • :required o campo é obrigatório.
  • :integer aceita-se somente números inteiros.
  • :float aceita-se numeros decimais.
  • :length;n é obrigatório que o campo tenha pelo menos 1 caractere.
  • :min_length;n aceita-se n caractere como valor mínimo.
  • :max_length;n aceita-se n caractere como valor máximo.
  • :accept o campo checkbox deve ser marcado.
  • :email o campo deve ter um endereço de email válido.

Por exemplo, digamos que tenhamos um formulário de registro, onde os campos usuário e senha são obrigatórios, e o campo de email deve aceitar somente email válido, então teríamos um formulário assim:

  1. <formmethod=“post”action=“”>
  2. Usuario:
  3. <inputname=“usuario” type=“text” id=“usuario” size=“36” class=“:required” />
  4. Senha:
  5. <inputname=“senha” type=“text” id=“senha” size=“36” class=“:required” />
  6. Email:
  7. <inputname=“email”type=“text” id=“email” size=“36” class=“:email” />
  8. <inputtype=“submit”name=“btsend”id=“btsend”value=“Registro” />
  9. </form>

Simples assim, com isso já teremos nosso formulário validado.

Agora se deseja personalizar esta validação basta modificar os estilos e as mensagens de erros e confirmações. Veja mais detalhes diretamente no site da biblioteca.

Link: Vanadium

3 thoughts to “Como validar formulários facilmente com Vanadium”

Leave a Reply

Your email address will not be published. Required fields are marked *