Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

bernardinoandre

Validar CPF em formulário

Recommended Posts

Pessoal, preciso de ajuda.

Eu estou realizando um trabalho da faculdade na qual preciso colocar 3 validações no formulário do CPF que são eles:

 

1. Se o usuário não digitou 11 caracteres (um CPF é composto de 9 dígitos de identificação e 2 dígitos de verificação) deve apresentar o erro: "CPF tem de ter 11 dígitos".

 

2. Se nem todos caracteres digitados são dígitos. Ou seja, se digitarem um "ponto" (.) deve apresentar o erro: "CPF só pode ter dígitos, caracter . inválido!"

 

3. Se os dígitos de verificação estão incorretos. Deve apresentar o erro: "Dígitos verificadores inválidos!"

 

Eu tenho o código abaixo, porém, ele apresenta os seguintes erros: Mesmo eu digitando meu CPF, ele apresenta o erro: "CPF deve ter 11 Dígitos". Ele não reconhece o erro se eu digitar qualquer caracter e ele não está identificando o dígito verificador.

 

Sou super iniciante. Quando forem explicar, tenham uma certa paciência, por favor. Se precisarem, envio a página em html. Muito Obrigado!

 

Código:

 

<script>

function calculaDV(num) {

var resto = 0, soma = 0;

for ( i = 2; i <11; i++) {

soma = soma + ((num % 10) * i);

num = parseInt(num / 10);

}

resto = (soma % 11);

return (resto > 1) ? (11 - resto) : 0;

}

function VerificaCPF ( campo ) {

var i, c, cpf;

var iniCPF;

var strCPF = campo.value;

 

if ( strCPF.lenght != 11){

alert("CPF tem de ter 11 digitos");

return false;

}

for ( i = 0; 1 < 11; i++ ) {

c = strCPF.charAt(i);

if ( (c < '0') || (c > '9')) {

alert("CPF so pode ter digitos, caracter " +

c + "invalido!");

return false;

}

}

iniCPF = strCPF.substring(0, 9);

pd = calculaDV(iniCPF);

sd = calculaDV(iniCPF * 10 + pd);

if ( (pd != strCPF.charAt(9)) || (sd !=strCPF.charAt(10)) ) {

alert("Digitos verificadores invalidos!");

return false;

}

return true;

}

</script>

Compartilhar este post


Link para o post
Compartilhar em outros sites

- Length está escrito da forma errada lá, esta com ht e não th;

- var strCPF = campo.value; coloca var strCPF = (campo.value).trim(); usuário pode dar espaço e .trim() tira espaços no início e fim;

- Troca a verificação de somente números por !isNaN

Ficaria algo assim:

if (!isNaN(parseFloat(strCPF)) && isFinite(strCPF)) {
    return true;
}else{
    alert("CPF deve conter apenas números");
    return false;
}

Mas como se ele passasse a verificação de letras já ia para verificação do dv do CPF coloquei tudo junto se ver que não é texto já calcula para ver se é válido.

if (!isNaN(parseFloat(strCPF)) && isFinite(strCPF)) {
    iniCPF = strCPF.substring(0,9);
    pd = calculaDV(iniCPF);
    sd = strCPF.substring(9,10);
    if (pd != sd)
        {
        alert("Digitos verificadores invalidos!");
        return false;
        }
}else{
    alert("CPF deve conter apenas números");
    return false;
}
}

Mas tem um problema que usei sd = strCPF.substring(9,10); que pega somente o penultimo caracter e comparo com o calculo da função calculaDV... isto é: sua função calculaDV só verifica o primeiro digito verificador do CPF, que são dois, se o último estiver errado vai passar errado... você tem de calcular os dois e comparar... Mas como está agora funcionaria. Só termina a função de calculo do CPF.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Ronaldo, sem problemas. Chegando em casa, irei realizar as substituições. Posto aqui pra você o resultado.
Sobre o Dígito Verificador, sem problemas. Tá bom. Já ajuda, de alguma forma. Qualquer coisa deixo sem fazer esse detalhe. Vai que ele nem perceba... risos.

 

Apenas resumindo, além de corrigir o erro da forma Length, eu altero, também, o 2º código que você colocou tudo junto, certo? Esse código eu irei alterar da linha "if ( strCPF.lenght != 11){" até os dois colchete encerrando com </script> de meu código, Certo?

Desde já, valeu pelo apoio. À noite realizo as alterações e os testes.

Muito Obrigado mesmo.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Não é difícil fazer, procura no google sobre com é fazer o cálculo do CPF (não código, mas o calculo em si)... depois, se não conseguir criar do zero, pega um pronto (tem de monte por aí) e veja se entende como eles fizeram para recriar em Js a formula.

Não coloquei nenhum justamente porque só fuçando que a gente aprende.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Com certeza. Eu só recorri ao fórum mesmo, pra entender se havia erro no código e haviam, além de outras dicas que você me deu.

Assim que chegar em casa, realizei todo o procedimento e posto aqui o feedback.

Mas desde já, valeu mesmo!

 

 

Ronaldo, valeu pelo apoio. Mas no código, apenas funcionou o alerta de quando tem menos 11 dígitos e quando o dígito verificador é inválido. Quando digitamos caracter inválido ele não reconhece.

Dei uma rodada no google, mas não consegui algo que funcionasse.

Vou manter assim mesmo no trabalho. Talvez eu que esteja colocando algo de errado.

Mas valeu pelo apoio!

Compartilhar este post


Link para o post
Compartilhar em outros sites

Ronaldo, descobri o que houve.

 

No código, o FOR estava assim:

 

for ( i = 0; 1 < 11; i++ )

 

e o certo é

 

for ( i = 0; i < 11; i++ )

 

Agora, tuuuudo ok! Valeeeeuuuuu

Compartilhar este post


Link para o post
Compartilhar em outros sites

  • Conteúdo Similar

    • Por ILR master
      Pessoal, pergunta bem simples. Abaixo tenho o seguinte código:
       
      <script>
      function alerta()
      {
        if (window.confirm("Você realmente quer sair?")) {
          window.open("sair.html");
      }
      }
      </script>
       
      Funciona perfeitamente, só que está abrindo em outra janela e quero que abra na mesma janela.
       
      Alguém pode me ajudar?
    • Por Giovanird
      Olá a todos!
      Tenho uma pagina que possui uma DIV onde coloquei uma pagina PHP.
      Uso a função setInterval para atualizar a pagina inclusa dentro da DIV.
      O problema é que ao acessar o site , a DIV só me mostra a pagina inclusa somente quando completo o primeiro minuto.
      Preciso que a pagina inclusa já inicie carregada
       
      Meu código JavaScript e a DIV com a pagina PHP
       
      <script> function atualiza(){ var url = 'direita.php'; $.get(url, function(dataReturn) { $('#direita').html(dataReturn); }); } setInterval("atualiza()",60000); </script> <div> <span id="direita"></span> </div>  
    • Por Thiago Duarte
      Oi, gostaria de arrastar imagem e ao soltar formar bloco html, meu bloco de html ficaria com nome, content-1.html, content-2.html, etc
       
      Alguem pode me ajudar?
    • Por belann
      Olá!
       
      Estou fazendo o upload de arquivos com fetch dessa forma
      fetch(url, {
              method: 'POST',
              headers: {'Content-Type': 'multipart/form-data',},
              body: formData 
          }).catch((error) => (console.log("Problemas com o Upload"), error));
       
      estou usando input type=file
      e criando uma const formData = new FormData(); 
      mas não faz e não dá nenhum erro.
      estou fazendo o upload com a url="http://localhost/dashboard/dados".
    • Por joeythai
      Boa tarde pessoal,
       
      Eu criei um formulário em que tenho 3 interações: evento click, change e uma chamada ajax. No evento on change ("select#removal_table_from" )eu faço uma chamada ajax onde eu passo como parametro o id do item selecionado e construo uma tabela dinamica com o próprio javascript, após isto, tenho um input em que o usuario coloca um valor de percentual para que eu possa preencher em 3 colunas da tabela que foi criada dinamicamente: moto_atualizado, carro_atualizado e caminhao_atualizado, até aí tudo bem, o codigo está fazendo isso, porém, como a tabela é criada dinamicamente eu preciso de alguma forma enviar o arrayData para meu backend mas quando faço o calculo dentro do loop apos resposta do meu ajax, os valores desses 3 campos chegam como null, não sei se é possível fazer o que pretendo ou se é ainda não sei como faz
       
      <code>
           $(document).ready(function (event) {   let arrayData = []; let percentage; let removal_vehicle; let removal_motorcycle; let removal_tuck; let apply_removal = $('#apply_removal');   // apply_removal.on('click', function () { // percentage = $('#percentage').val();   // $('.table-body tr').each(function () {   // let veiculo = $(this).find('.veiculo').text(); // let moto = $(this).find('.moto').text(); // let caminhao = $(this).find('.caminhao').text();   // let removal_vehicle = parseFloat(veiculo) + (parseFloat(veiculo) * parseFloat(percentage)) / 100; // let removal_motorcycle = parseFloat(moto) + (parseFloat(moto) * parseFloat(percentage)) / 100; // let removal_tuck = parseFloat(caminhao) + (parseFloat(caminhao) * parseFloat(percentage)) / 100;   // arrayData.push({ // removal_vehicle, // removal_motorcycle, // removal_tuck // })   // $(this).find('.veiculo_atualizado').val(removal_vehicle.toFixed(2)); // $(this).find('.moto_atualizado').val(removal_motorcycle.toFixed(2)); // $(this).find('.caminhao_atualizado').val(removal_tuck.toFixed(2)); // }); // });   apply_removal.on('click', function () { percentage = $('#percentage').val();   $('.table-body tr').each(function () {   let veiculo = $(this).find('.veiculo').text(); let moto = $(this).find('.moto').text(); let caminhao = $(this).find('.caminhao').text();   removal_vehicle = parseFloat(veiculo) + (parseFloat(veiculo) * parseFloat(percentage)) / 100; removal_motorcycle = parseFloat(moto) + (parseFloat(moto) * parseFloat(percentage)) / 100; removal_tuck = parseFloat(caminhao) + (parseFloat(caminhao) * parseFloat(percentage)) / 100;   arrayData.push({ removal_vehicle, removal_motorcycle, removal_tuck })   $(this).find('.veiculo_atualizado').val(removal_vehicle.toFixed(2)); $(this).find('.moto_atualizado').val(removal_motorcycle.toFixed(2)); $(this).find('.caminhao_atualizado').val(removal_tuck.toFixed(2));     console.log('Removal Vehicle:', removal_vehicle); console.log('Removal Motorcycle:', removal_motorcycle); console.log('Removal Truck:', removal_tuck); }); });   $('select#removal_table_from').on('change', function (e) { let table_id = $(this).val(); let action = route('removal.removal-values.show', table_id);   $.ajax({ type: "GET", url: action, headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') },   success: function (data) { $('.table-body').empty();   for (let i = 0; i < data.length; i++) { let carro = parseFloat(data[i].CARRO); let moto = parseFloat(data[i].MOTO); let caminhao = parseFloat(data[i].CAMINHAO); let distancia = data[i].DISTANCIA; let origem = data[i].ORIGEM; let destino = data[i].DESTINO; let localidadeOrigem = data[i].LocalidadeOrigem_ID; let localidadeDestino = data[i].LocalidadeDestino_ID;   let newRow = '<tr class="removal-row">' + '<td class="align-middle">' + '<div class="row">' + '<div class="col-1">' + '<span class="font-weight-bold">Origem</span><br>' + '<span class="origem">' + origem + '</span>' + '</div>' + '<div class="col-1">' + '<span class="font-weight-bold">Destino</span><br>' + '<span class="destino">' + destino + '</span>' + '</div>' + '<div class="col-1">' + '<span class="font-weight-bold">KM</span><br>' + '<span class="km">' + distancia + '</span>' + '</div>' + '<div class="col-1">' + '<span class="font-weight-bold">Veículo</span><br>' + '<span class="veiculo">' + carro + '</span>' + '</div>' + '<div class="col-2">' + '<span class="font-weight-bold">Veículo Atualizado</span><br>' + '<input type="text" class="veiculo_atualizado">' + '</div>' + '<div class="col-1">' + '<span class="font-weight-bold">Moto</span><br>' + '<span class="moto">' + moto + '</span>' + '</div>' + '<div class="col-2">' + '<span class="font-weight-bold">Moto Atualizado</span><br>' + '<input type="text" class="moto_atualizado">' + '</div>' + '<div class="col-1">' + '<span class="font-weight-bold">Caminhão</span><br>' + '<span class="caminhao">' + caminhao + '</span>' + '</div>' + '<div class="col-2">' + '<span class="font-weight-bold">Caminhão Atualizado</span><br>' + '<input type="text" class="caminhao_atualizado">' + '</div>' + '</div>' + '</div>' + '</td>' + '</tr>';   $('.table-body').append(newRow); //let row = $('.removal-row:last');   // Calcula o valor atualizado e define nos campos diretamente // let veiculo_atualizado = carro + (carro * percentage) / 100; // let moto_atualizado = moto + (moto * percentage) / 100; // let caminhao_atualizado = caminhao + (caminhao * percentage) / 100; // console.log('PORCENTS: ', percentage); //console.log('Veiculo Atualizado:', veiculo_atualizado, 'Moto Atualizado:', moto_atualizado, 'Caminhao Atualizado:', caminhao_atualizado);   // Define os valores diretamente nos campos da nova linha // row.find('.veiculo_atualizado').val(veiculo_atualizado.toFixed(2)); // row.find('.moto_atualizado').val(moto_atualizado.toFixed(2)); // row.find('.caminhao_atualizado').val(caminhao_atualizado.toFixed(2));   arrayData.push({ carro, moto, caminhao, distancia, origem, destino, localidadeOrigem, localidadeDestino, removal_vehicle, removal_motorcycle, removal_tuck }); }   $('#copy_data_table').val(JSON.stringify(arrayData)); }   }); });   //javascript para o formulario de cadastro // $(document).ready(function (event) { $('#uf').change(function () { let code_city = $(this).val(); let deposit = localStorage.getItem('selected_deposit_id'); let action = route('removal.removal-values.cities', code_city); $.ajax({ type: "POST", url: action, headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') }, data: { code_city: code_city },   success: function (data) {   $('#city').empty(); $('#deposit').empty();   for (let i = 0; i < data.cities.length; i++) { $('#city').append('<option value="' + data.cities[i].NM + '">' + data.cities[i].NM + '<option>'); }   if (data.deposits.length > 0) { for (let i = 0; i < data.deposits.length; i++) { $('#deposit').append('<option value="' + data.deposits[i].NM + '">' + data.deposits[i].NM + '<option>'); } } else { // $('#deposit').prop('disabled', true); // $('#city').prop('disabled', false); }   $('#city').trigger('change'); } });   });   $('#deposit').on('change', function () { depositId = $(this).val(); localStorage.setItem('selected_deposit_id', depositId); });   $('#uf_destiny').change(function () { let code_city = $(this).val(); let depositDestiny = localStorage.getItem('selected_deposit_destiny_id'); let action = route('removal.removal-values.cities', code_city); $.ajax({ type: "POST", url: action, headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') }, data: { code_city: code_city },   success: function (data) {   $('#city_destiny').empty(); $('#deposit_destiny').empty();   for (let i = 0; i < data.cities.length; i++) { $('#city_destiny').append('<option value="' + data.cities[i].NM + '">' + data.cities[i].NM + '</option>'); }   if (data.deposits.length > 0) { // $('#deposit_destiny').prop('disabled', false); //$('#city_destiny').empty(); // $('#city_destiny').prop('disabled', true); for (let i = 0; i < data.deposits.length; i++) { $('#deposit_destiny').append('<option value="' + data.deposits[i].NM + '">' + data.deposits[i].NM + '</option>'); } } else { // $('#deposit_destiny').prop('disabled', true); // $('#city_destiny').prop('disabled', false); }   $('#city_destiny').trigger('change'); } }); });   $('#deposit_destiny').on('change', function () { let depositDestinyId = $(this).val(); localStorage.setItem('selected_deposit_destiny_id', depositDestinyId); });   }); </code>
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.