ERRO COM BOTÃO <BUTTON> EM CÓDIGO HTML

KELLY 04/03/2015 16:36:10
#444968
Boa tarde pessoal,

Estou criando um exemplo simples onde o usuário deve informar o CPF e EMAIL para logar no sistema, porém, mesmo os dados estarem corretos, CPF com a quantidade de dígitos e EMAIL contendo @ e domínio, ou seja, passando pelos critérios de validação, os campos são limpos. Eu queria que fossem limpos os campos de CPF e EMAIL apenas se os campos não forem válidos. Eu não queria usar links no lugar do botão.

Alguém pode me dar uma ajuda?

<!DOCTYPE hmlt>
<html lang=[Ô]pt-BR[Ô]>
<head>
<meta charset=[Ô]UTF-8[Ô]/>
<link rel=[Ô]stylesheet[Ô] type=[Ô]text/css[Ô] href=[Ô]css/estilo.css[Ô] media=[Ô]all[Ô]/>
<script type=[Ô]text/javascript[Ô] src=[Ô]js/java.js[Ô]></script>
<title>Objeto RegExp (Validação e Formatação)</title>
</head>
<body>
<h3>Expressões Regulares</h3>
<form id=[Ô]formulario[Ô]>
<fieldset>
<legend>Validação e Formatação</legend>
<label for=[Ô]cpf[Ô]>CPF:</label>
<input type=[Ô]text[Ô] name=[Ô]cpf[Ô]/>

<label for=[Ô]email[Ô]>E-mail:</label>
<input type=[Ô]text[Ô] name=[Ô]email[Ô]/>

<button id=[Ô]botao[Ô] onclick=[Ô]validar()[Ô]>Validar</button>
</fieldset>
</form>
</body>
</html>

Código JavaScript
-----------------------

function validar(){
var frm = document.getElementById([Ô]formulario[Ô]);
var cpf = frm.cpf;
var email = frm.email;

var re_cpf = /^([\d]{3})([\d]{3})([\d]{3})([\d]{2})$/;
var re_email = /^([\w-]+(\.[\w-]+)*)@(([\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(\.[a-z]{2})?)$/i;

if(re_cpf.test(cpf.value)){
cpf.value = cpf.value.replace(re_cpf, [Ô]$1.$2.$3-$4[Ô]);
}
else {
alert([Ô]CPF deve ter apenas 11 números, sem ponto ou traço[Ô]);
cpf.value = [Ô][Ô];
}

if(!re_email.test(email.value)){
alert([Ô]E-mail Inválido[Ô]);
cpf.value = [Ô][Ô];
}
}

CLEVERTON 04/03/2015 17:23:50
#444970
Resposta escolhida
coloca essa linha do button assim e veja se resolve.
<button id=[Ô]botao[Ô] onclick=[Ô]validar(); return false[Ô]>Validar</button>

Citação:

se vc for usar o $_POST do PHP vai ter que enviar o Submit via JavaScript na função que valida os campos


KELLY 05/03/2015 17:02:51
#445009
Boa tarde Cleverton, funcionou. Por que acontece isso? Tem outro lugar de informar o RETURN FALSE ou é sempre no evento de um elemento?

Grata!

CLEVERTON 05/03/2015 17:22:58
#445012
o ideal é no OnClick, ele vai executar o Validar() e depois o Return, porém se vc quiser submeter o form caso os dados sejam validos vc usa na função validar o SubMit


Citação:

if(!re_email.test(email.value)){
alert([Ô]E-mail Inválido[Ô]);
cpf.value = [Ô][Ô];
}
[txt-color=#e80000]else
{
frm.submit();
}
[/txt-color]

KELLY 06/03/2015 17:18:03
#445047
Obrigada CLEVERTON pela ajuda!


Tópico encerrado , respostas não são mais permitidas