-5

Eu tenho uma página de cadastro que estou validando, e agora tenho de validar o CPF. Eu peguei um código aqui no site para validá-lo, este:

function VerificaCPF(strCpf) {

var soma;
var resto;
soma = 0;
if (strCpf == "00000000000") {
    return false;
}

for (i = 1; i <= 9; i++) {
    soma = soma + parseInt(strCpf.substring(i - 1, i)) * (11 - i);
}

resto = soma % 11;

if (resto == 10 || resto == 11 || resto < 2) {
    resto = 0;
} else {
    resto = 11 - resto;
}

if (resto != parseInt(strCpf.substring(9, 10))) {
    return false;
}

soma = 0;

for (i = 1; i <= 10; i++) {
    soma = soma + parseInt(strCpf.substring(i - 1, i)) * (12 - i);
}
resto = soma % 11;

if (resto == 10 || resto == 11 || resto < 2) {
    resto = 0;
} else {
    resto = 11 - resto;
}

if (resto != parseInt(strCpf.substring(10, 11))) {
    return false;
}

return true;
}

Só que agora eu não sei como faço para colocá-lo em meu código. Na minha página HTML, eu tenho o campo CPF de ID 'cpf1' e name: 'txtCPF' e no final tenho o botão de cadastrar do tipo 'submit' name='btn1' onclick='return validacaodenome() (que é a minha função que eu uso pra validar todo o resto, menos o CPF.

E na minha página de script eu tenho uma function validacaodenome() que serve para validar todo o resto. Eu gostaria de saber o que devo fazer para fazer este código ser executado junto com o meu botão de cadastrar com a mensagem: alert("CPF Inválido") apenas, se não tiver inválido, ele cadastra normalmente. Estou com dificuldades em implementar este código no meu projeto.

4
  • tem uma function em jquery que faz essa verificação amigo Commented 10/05/2018 às 18:38
  • sua dúvida é como chamar?
    – Laerte
    Commented 10/05/2018 às 18:40
  • Já existe uma pergunta (com resposta) onde pode lhe orientar: pt.stackoverflow.com/questions/51340/…
    – Vinícius
    Commented 10/05/2018 às 18:42
  • @Laerte sim, estou com dúvida em como faço pra chamar isso Commented 10/05/2018 às 18:49

2 Respostas 2

1

Tente isso aqui:

function muitoCurto(campo, nome, tamanho) {
    if (campo.value.length >= tamanho) return false;
    alert("O conteúdo do campo '" + nome
            + "' deveria ter pelo menos " + tamanho + " caracteres."
            + " Por favor, preencha-o corretamente.");
    return true;
}

function tamanhoErrado(campo, nome, tamanho) {
    if (campo.value.length === tamanho) return false;
    alert("O conteúdo do campo '" + nome
            + "' deveria ter exatamente " + tamanho + " caracteres. "
            + "Por favor, preencha-o corretamente.");
    return true;
}

function naoNumerico(campo, nome) {
    if (!isNaN(campo.value)) return false;
    alert("Digite somente números no campo '" + nome + "', por favor.");
    return true;
}

function diferentes(campo1, nome1, campo2, nome2) {
    if (campo1.value === campo2.value) return false;
    alert("Os campos '" + nome1 + "' e '" + nome2 + "' devem ser iguais.");
    return true;
}

function validarFormulario() {
    var cad = document.getElementById('cad');

    if (muitoCurto(cad.txtnome, 'Nome', 2)) return;
    if (muitoCurto(cad.txtsobrenome, 'Sobrenome', 2)) return;
    if (tamanhoErrado(cad.txtCPF, 'CPF', 11)) return;
    if (tamanhoErrado(cad.txtDDD, 'DDD', 2)) return;
    if (muitoCurto(cad.txtContato, 'Nº do telefone', 8)) return;
    if (muitoCurto(cad.txtEmail1, 'E-mail', 10)) return;
    if (muitoCurto(cad.txtRua, 'Logradouro', 3)) return;
    if (muitoCurto(cad.txtBairro, 'Bairro', 3)) return;
    if (muitoCurto(cad.txtCidade, 'Cidade', 3)) return;
    if (muitoCurto(cad.txtNumero, 'Número do endereço', 1)) return;
    if (tamanhoErrado(cad.txtCep, 'CEP', 8)) return;
    if (muitoCurto(cad.txtLogin, 'Nome de usuário', 7)) return;
    if (muitoCurto(cad.txtsenha, 'Senha', 6)) return;
    if (muitoCurto(cad.txtCsenha, 'Confirmação da senha', 6)) return;
    if (naoNumerico(cad.txtCPF, 'CPF')) return;
    if (naoNumerico(cad.txtDDD, 'DDD')) return;
    if (naoNumerico(cad.txtContato, 'Nº do telefone')) return;
    //if (naoNumerico(cad.txtNumero, 'Número')) return;
    if (naoNumerico(cad.txtCep, 'CEP')) return;

    if (diferentes(cad.txtsenha, 'Senha', cad.txtCsenha, 'Confirmação da Senha')) return;
    if (diferentes(cad.txtEmail1, 'E-mail', cad.txtEmail2, 'Confirmação de E-mail')) return;

    if (cad.txtdata_nasc.value.length !== 10) {
        alert("Formato de 'data de nascimento' inválido."
                + " Por favor, preencha-o corretamente.");
        return;
    }

    if (!verificarCPF(cad.txtCPF.value)) {
        alert("Os dígitos verificadores do CPF não conferem.");
        return;  
    }

    cad.submit();
}

function verificarCPF(strCpf) {
    if (!/[0-9]{11}/.test(strCpf)) return false;
    if (strCpf === "00000000000") return false;

    var soma = 0;

    for (var i = 1; i <= 9; i++) {
        soma += parseInt(strCpf.substring(i - 1, i)) * (11 - i);
    }

    var resto = soma % 11;

    if (resto === 10 || resto === 11 || resto < 2) {
        resto = 0;
    } else {
        resto = 11 - resto;
    }

    if (resto !== parseInt(strCpf.substring(9, 10))) {
        return false;
    }

    soma = 0;

    for (var i = 1; i <= 10; i++) {
        soma += parseInt(strCpf.substring(i - 1, i)) * (12 - i);
    }
    resto = soma % 11;

    if (resto === 10 || resto === 11 || resto < 2) {
        resto = 0;
    } else {
        resto = 11 - resto;
    }
 
    if (resto !== parseInt(strCpf.substring(10, 11))) {
        return false;
    }

    return true;
}
<form id="cad" method="post" action="#" required>
    <h3>Dados pessoais</h3>
    Nome: <input type="text" name="txtnome" maxlength="40" required />
    <br>
    Sobrenome: <input type="text" name="txtsobrenome" maxlength="30" required />
    <br>
    Data de nascimento: <input type="date" name="txtdata_nasc" required />
    <br>
    CPF: <input type="text" id="cpf1" name="txtCPF" maxlength="11" required />
    <br>

    <h3>Dados para Contato</h3>
    DDD: <input type="text" name="txtDDD" placeholder="Ex: (###)"  maxlength="2" required /><br>
    Tipo: <input type="radio" name="rbT" value="Celular" checked />Celular
    <input type="radio" name="rbT" value="Telefone" />Telefone
    <br>  
    Nº: <input type="tel" name="txtContato" maxlength="9" required  />
    <br>  
    E-mail: <input type="email" name="txtEmail1" maxlength="50" id="Email1" placeholder="[email protected]" required />
    <br>
    Confirmação de E-mail: <input type="email" name="txtEmail2" maxlength="50" id="Email2" required />
    <br>

    <h3>Dados do Endereço</h3>
    Logradouro: <input type="text" name="txtRua" maxlength="50" required />
    <br>
    Bairro: <input type="text" name="txtBairro" maxlength="35" required />
    <br>
    Cidade: <input type="text" name="txtCidade" maxlength="25" required />
    <br>
    Estado:
    <select name="cbEstado" required>
        <option>Acre</option>    
        <option>Alagoas</option>
        <option>Amapá</option>
        <option>Amazonas</option>
        <option>Bahia</option>
        <option>Brasília</option>
        <option>Ceará</option>
        <option>Espírito Santo</option>
        <option>Goiás</option>
        <option>Maranhão</option>
        <option>Mato Grosso</option>
        <option>Mato Grosso do Sul</option>
        <option>Minas Gerais</option>
        <option>Pará</option>
        <option>Paraíba</option>
        <option>Paraná</option>
        <option>Pernambuco</option>
        <option>Piauí</option>
        <option>Rio de Janeiro</option>
        <option>Rio Grande do Norte</option>
        <option>Rio Grande do Sul</option>
        <option>Rondônia</option>
        <option>Roraima</option>
        <option>Santa Catarina</option>
        <option>São Paulo</option>
        <option>Sergipe</option>
        <option>Tocantins</option>
    </select>
    <br>
    Número: <input type="text" name="txtNumero" maxlength="7" required />
    <br>
    CEP: <input type="text" name="txtCep" placeholder="Ex: #####-###" maxlength="8" required />
    <br>
    Complemento: <input type="text" name="txtComplemento" maxlength="40" />
    <br>

    <h3>Dados da conta</h3>
    Nome de usuário: <input type="text" name="txtLogin" required maxlength="20" />
    <br>
    Senha: <input type="password" name="txtsenha" required maxlength="20" />
    <br>
    Confirmação da senha: <input type="password" name="txtCsenha" required maxlength="20" />
    <br>
    Tipo de usuário: <input type="radio" name="rb" value="Usuario" checked />Cliente
    <input type="radio" name="rb" value="Tecnico" />Técnico
    <br>

    <button type="button" id="btn1" onclick='javascript: validarFormulario()'>Cadastrar</button>
</form>

O StackOverflow não deixa postar o HTML executável inteiro devido a vários motivos. Assim sendo, a estrutura ideal do HTML seria essa:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Cadastro</title>
        <script type="text/javascript" src="javascrito.js"></script>
    </head>
    <body>
    <!--
        COPIE E COLE O HTML ACIMA AQUI!
    -->
    </body>
</html>

Havia alguns erros no seu código, como por exemplo usar VerificaCPF e verificarCPF, observe que há diferença nas grafias.

Também havia dois botões definidos de maneiras diferentes, o que acabava confundindo e nenhum deles estava certo, um estava com metade certa e metade errada e o outro estava com a outra metade certa e a outra metade errada.

Os campos CEP e CPF estavam com o tamanho no maxlength errados.

A instrução com o submit(); estava no lugar errado! Ela deveria ficar fora do último if.

Note que números de logradouros não necessariamente são numéricos. Por exemplo, em 2015, eu morava no número 3524A e meu vizinho era o 3524B. Além disso, logradouros sem numeração frequentemente são representados com "s/n".

Existem nomes e sobrenomes com duas letras, inclusive conheço pessoalmente duas pessoas, descendentes de chineses, com o sobrenome "Li". Já vi o primeiro nome ter só duas letras também.

Como pode notar, também simplifiquei bastante a lógica de verificação do seu formulário.

9
  • realmente cara, eu não sei com que palavras posso te agradecer, você simplesmente salvou a minha vida e o meu trabalho TCC, muito obrigado, a partir do seu código eu aprendi muitas coisas. Commented 12/05/2018 às 1:26
  • Só tem um problema, não que eu esteja reclamando, mas o verificador de CPF continua do mesmo jeito, se eu digitar um número de CPF ele sempre volta com a mensagem de erro definida como alert("Os dígitos verificadores do CPF não conferem."); Commented 12/05/2018 às 2:31
  • Victor, desculpa se é pedir demais, mas poderia dar uma olhada de novo? Commented 12/05/2018 às 2:31
  • ele só não dá erro se eu digitar um número qualquer de até 11 carácteres mas que termine com um '0' (zero) no final. Porém, se eu digitar tal número, exemplo '12345678910' e apertar no botão cadastrar, ele não volta erro nenhum, porém não envia o formulário, continua o mesmo. Commented 12/05/2018 às 2:35
  • Na verdade, tô sem entender nada. Alguns cpf ele deixa cadastrar e outros ele volta com o erro Commented 12/05/2018 às 2:41
1

function verificarCPF(strCpf) {
    if (!/[0-9]{11}/.test(strCpf)) return false;
    if (strCpf === "00000000000") return false;

    var soma = 0;

    for (var i = 1; i <= 9; i++) {
        soma += parseInt(strCpf.substring(i - 1, i)) * (11 - i);
    }

    var resto = soma % 11;

    if (resto === 10 || resto === 11 || resto < 2) {
        resto = 0;
    } else {
        resto = 11 - resto;
    }

    if (resto !== parseInt(strCpf.substring(9, 10))) {
        return false;
    }

    soma = 0;

    for (var i = 1; i <= 10; i++) {
        soma += parseInt(strCpf.substring(i - 1, i)) * (12 - i);
    }
    resto = soma % 11;

    if (resto === 10 || resto === 11 || resto < 2) {
        resto = 0;
    } else {
        resto = 11 - resto;
    }

    if (resto !== parseInt(strCpf.substring(10, 11))) {
        return false;
    }

    return true;
}

function validarNome() {
    var strCpf = document.getElementById('cpf1').value;
    if (!verificarCPF(strCpf)) {
        alert("CPF inválido");
        return;
    }
    document.getElementById('frm').submit();
}
<form id="frm" method="POST" action="example.com/">
    <div>Nome: <input type="text" id="nome" name="txtNome" value="Zé" /></div>
    <div>CPF: <input type="text" id="cpf1" name="txtCPF" value="00000000000" /> (sem pontos, traços e nem espaços em branco)</div>
    <div><button type="button" id="btn1" onclick='javascript:validarNome()'>Enviar</button></div>
</form>

Veja no código acima a função validarNome (acho que é melhor chamá-la assim que validacaodenome). Ela é bem simples e curta e faz o que você quer.

Clique no botão azul Executar para testar este código. Se o CPF for inválido, ele te dá o alert. Se for válido, ele dá o submit no form (mas o resultado do submit é um erro 404 porque ele não envia os dados para algum lugar que exista de fato).

Também melhorei um pouco o código da função verificarCPF. Nela também acrescentei o if (!/[0-9]{11}/.test(strCpf)) return false;, que faz retornar false se o strCpf não for uma string composta por exatamente 11 dígitos. Isso serve para rejeitar entradas que não sejam numéricas, que sejam muito longas ou muito curtas.

2
  • @sdkamda2323 Postei outra resposta abaixo para deixar mais organizado, até porque ela já está bem diferente do que a que postei originalmente aqui. Commented 11/05/2018 às 3:56
  • 1
    Bem mais limpo teu código. Parabéns. Commented 17/08/2023 às 20:52

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .