Archive for the ‘Tutoriais’ Category
Validando formulários com jQuery
Author: admin28 nov
Validar formulários é uma das tarefas mais corriqueiras de um profissional web.
Com jQuery, torna-se bem mais simples esta tarefa.
Dê uma olhada… Tenho certeza que você vai gostar!
Jquery – Primeiros passos
Author: admin10 nov
Um tutorial que explica como você pode iniciar com jQuery. Um explicação de sua sintaxe e como iniciar neste framework que é um sucesso!
No começo, é comum esbarrar-se com a dificuldade de entender a sintaxe. A quantidade de “()” e “{}” pode atrapalhar um pouco. Mas com o tempo, esta dificuldade é superada.
Para começar, você deve acessar o site do framework e baixar a sua última versão. Acesse http://www.jquery.com e faça o download.
Jump menu utilizando jQuery
Author: admin9 nov
Uma vídeo aula que explica passo-a-passo a criação de um jump menu utilizando jQuery + Dreamweaver
Por que jQuery?
Author: admin8 nov
Uma resposta rápida e corriqueira: “Para não reinventar a roda”. Esta é a proposta deste framework. Um exemplo prático é a validação de formulários. Definitivamente, é maçante perder horas preciosas para definir uma dezena de “if’s” que bloqueiam possíveis emails incorretos, etc. jQuery é tornar isto muito rápido, simples e extremamente profissional.
Profissionalismo é um outro ponto importantíssimo. Você torna-se capaz de criar páginas com recursos altamente sofisticados sem a necessidade de recorrer ao Flash com suas limitações. Além de parar com as preocupações com a compatibilidade entre navegadores, pois jQuery funciona com o IE6, FF, Chrome, IE7 e IE8 igualmente! O framework já foi feito com este intuito.
O código abaixo é um exemplo bem simples e prático do ganho de tempo que jQuery vai lhe oferecer.
Mesmo que você não conheça jQuery, tenho certeza que entenderá o que o código abaixo faz.
-
$(“#formulario”).validate({
-
-
//Definindo em qual DIV as mensagens de erros aparecerão
-
errorLabelContainer: $(“#erros”),
-
-
//Quais são as regras para cada campo Input, textarea, etc
-
rules:
-
{
-
nome:
-
{
-
required:true,
-
minlength:5
-
},
-
email:
-
{
-
required:true,
-
email:true
-
},
-
senha:
-
{
-
required:true,
-
minlength:8
-
},
-
confirmacao_senha:
-
{
-
required:true,
-
minlength:8,
-
equalTo:“#senha”
-
}
-
-
-
},
-
-
// Definindo a mensagem de erro para cada campo incluso em “rules”
-
messages:
-
{
-
nome:
-
{
-
required:“<img src=\”imagens/erro.png\” alt=\”erro\” align=\”top\”/>O campo nome deve ser preenchido<br/>”,
-
minlength:“<img src=\”imagens/erro.png\” alt=\”erro\” align=\”top\”/>Nome inválido<br/>”
-
},
-
email:
-
{
-
required:“<img src=\”imagens/erro.png\” alt=\”erro\” align=\”top\”/>O email é obrigatório<br/>”,
-
email:“<img src=\”imagens/erro.png\” alt=\”erro\” align=\”top\”/>Email inválido.<br/>”
-
},
-
senha:
-
{
-
required:“<img src=\”imagens/erro.png\” alt=\”erro\” align=\”top\”/>É necessário informar uma senha<br/>”,
-
minlength:“<img src=\”imagens/erro.png\” alt=\”erro\” align=\”top\”/>Sua senha precisa ter no mínimo 8 caracteres<br/>”
-
},
-
confirmacao_senha:
-
{
-
required:“<img src=\”imagens/erro.png\” alt=\”erro\” align=\”top\”/>É necessário confirmar sua senha<br/>”,
-
minlength:“<img src=\”imagens/erro.png\” alt=\”erro\” align=\”top\”/>Sua senha precisa ter no mínimo 8 caracteres<br/>”,
-
equalTo:“<img src=\”imagens/erro.png\” alt=\”erro\” align=\”top\”/>As senhas não coincidem<br/>”
-
}
-
-
}
-
});
-
Tenho certeza que você já precisou validar um formulário e perdeu tempo e paciência para criar algo que é primordial.
Pra finalizar, veja algumas das empresas/entidades que utilizam o jQuery em seus sites:
Dell
Google
Mozilla
Digg
Wordpress
Drupal
NBC
Vale a pena, não?