PáginasWeb com: HTML, CSS e JavaScript
Profª. Marlene da Silva Maximiano de Oliveira
& Profª. Alessandra Aparecida da Silva
Validação de Formulário
HTML E JavaScript
Estrutura
<html>
<head>
<title> formulário com validação</title>
<script>...</script>
</head>
<body>
<form>
...
</form>
</body>
</html>
O Formulário
...
<form name="form1" action="enviar.php" method="post">
Nome:
<input name="nome" type="text"> <br>
Email:
<input name="email" type="text"> <br>
Senha:
<input name="senha" type="password"> <br>
Repetir Senha:
<input name="rep_senha" type="password"> <br>
<input type="submit" onclick="return validar()">
</form>
....
Obs. Para que os dados
sejam enviados é necessário
um arquivo PHP.
Assim os dados são
enviados para um banco de
dados ou para um banco de
dados.
Java Script
.
.
<script>
function validar() {
var nome = form1.nome.value;
var email = form1.email.value;
var senha = form1.senha.value;
var rep_senha = form1.rep_senha.value;
if (nome == "") {
alert('Preencha o campo com seu nome');
form1.nome.focus();
return false;
}
if ((email.length != 0) && ((email.indexOf("@") < 1) ||
(email.indexOf('.') < 1))){
alert('email inválido!');
form1.email.value="";
form1.email.focus();
return false;
}
alert('Enviados com sucesso!');
return true;
}
</script>

13 Java Script - Validação de formulário

  • 1.
    PáginasWeb com: HTML,CSS e JavaScript Profª. Marlene da Silva Maximiano de Oliveira & Profª. Alessandra Aparecida da Silva
  • 2.
  • 3.
    Estrutura <html> <head> <title> formulário comvalidação</title> <script>...</script> </head> <body> <form> ... </form> </body> </html>
  • 4.
    O Formulário ... <form name="form1"action="enviar.php" method="post"> Nome: <input name="nome" type="text"> <br> Email: <input name="email" type="text"> <br> Senha: <input name="senha" type="password"> <br> Repetir Senha: <input name="rep_senha" type="password"> <br> <input type="submit" onclick="return validar()"> </form> .... Obs. Para que os dados sejam enviados é necessário um arquivo PHP. Assim os dados são enviados para um banco de dados ou para um banco de dados.
  • 5.
    Java Script . . <script> function validar(){ var nome = form1.nome.value; var email = form1.email.value; var senha = form1.senha.value; var rep_senha = form1.rep_senha.value; if (nome == "") { alert('Preencha o campo com seu nome'); form1.nome.focus(); return false; } if ((email.length != 0) && ((email.indexOf("@") < 1) || (email.indexOf('.') < 1))){ alert('email inválido!'); form1.email.value=""; form1.email.focus(); return false; } alert('Enviados com sucesso!'); return true; } </script>