1

Tenho o seguinte código de um formulário que ao sair do campo CPF é feita a validação do CPF. Gostaria que se o teste for mal sucedido a classe "has-error" fosse incluída na div onde o input está localizado e se for bem sucedido adicionar a classe "has-success". Como tenho vários divs com a classe "form-group" tentei usar o parents() mas não funcionou.

function validaCPF2(cpf_principal_condutor) {
    if (!testCPF2(cpf_principal_condutor)) {
        $('#errocpf2').show();
		    $(this).parents('.form-group').removeClass('has-success');
		    $(this).parents('.form-group').addClass('has-error');
		    document.getElementById("cpf_principal_condutor").focus();
        return false;
    } else {
		    $('#errocpf2').hide();
		    $(this).parents('.form-group').removeClass('has-error');
		    $(this).parents('.form-group').addClass('has-success');
        return true;
    }
};
function testCPF2() {
    var strCPF = $("#cpf_principal_condutor").val().replace(".","").replace(".","").replace('-',"").replace("_","");
    var Soma;
    var Resto;
    Soma = 0;
	if (strCPF === "00000000000") return false;
	if (strCPF === "11111111111") return false;
	if (strCPF === "22222222222") return false;
	if (strCPF === "33333333333") return false;
	if (strCPF === "44444444444") return false;
	if (strCPF === "55555555555") return false;
	if (strCPF === "66666666666") return false;
	if (strCPF === "77777777777") return false;
	if (strCPF === "88888888888") return false;
	if (strCPF === "99999999999") return false;
	
    
	for (i=1; i<=9; i++) Soma = Soma + parseInt(strCPF.substring(i-1, i)) * (11 - i);
	Resto = (Soma * 10) % 11;
	
    if ((Resto === 10) || (Resto === 11))  Resto = 0;
    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 * 10) % 11;
	
    if ((Resto === 10) || (Resto === 11))  Resto = 0;
    if (Resto !== parseInt(strCPF.substring(10, 11) ) ) return false;
    return true;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-group">
  <label class="control-label">Nome completo do condutor principal do veículo: *</label>
  <input id="nome_principal_condutor" name="nome_principal_condutor" placeholder=" " type="text" class="form-control" required>
</div>
<div class="form-group">
  <label class="control-label">CPF do principal condutor *</label>
  <input id="cpf_principal_condutor" name="cpf_principal_condutor" placeholder="123.456.789-00" onblur="validaCPF2();" type="text" class="form-control" required>
  <small id="errocpf2" style="color: #a94442; display:none;" class="help-block">O CPF informado é inválido</small>
</div>

1 Resposta 1

2

Você não está passando o input para a função, logo o argumento cpf_principal_condutor não tem nenhum valor, e o $(this) também não está se referindo a nada.

Você deve enviar o elemento via this no onblur:

onblur="validaCPF2(this);"

Assim o argumento cpf_principal_condutor da função será o input que chamou a função. Na função você pega o valor do campo com cpf_principal_condutor.value e usa como argumento para validar o CPF.

E troque o $(this) por cpf_principal_condutor, que é o input em questão.

Coloquei dois console.log() no código apenas para ilustrar a mudança da classe. Apague essas linhas ao colocar em produção.

Veja:

function validaCPF2(cpf_principal_condutor) {

    if (!testCPF2(cpf_principal_condutor.value)) {
        $('#errocpf2').show();
		    $(cpf_principal_condutor).parents('.form-group').removeClass('has-success');
		    $(cpf_principal_condutor).parents('.form-group').addClass('has-error');
		    $("#cpf_principal_condutor").focus();

        console.log($(cpf_principal_condutor).parents('.form-group')[0]);

        return false;
    } else {
		    $('#errocpf2').hide();
		    $(cpf_principal_condutor).parents('.form-group').removeClass('has-error');
		    $(cpf_principal_condutor).parents('.form-group').addClass('has-success');
        console.log($(cpf_principal_condutor).parents('.form-group')[0]);
        return true;
    }
    
};
function testCPF2() {
    var strCPF = $("#cpf_principal_condutor").val().replace(".","").replace(".","").replace('-',"").replace("_","");
    var Soma;
    var Resto;
    Soma = 0;
	if (strCPF === "00000000000") return false;
	if (strCPF === "11111111111") return false;
	if (strCPF === "22222222222") return false;
	if (strCPF === "33333333333") return false;
	if (strCPF === "44444444444") return false;
	if (strCPF === "55555555555") return false;
	if (strCPF === "66666666666") return false;
	if (strCPF === "77777777777") return false;
	if (strCPF === "88888888888") return false;
	if (strCPF === "99999999999") return false;
	
    
	for (i=1; i<=9; i++) Soma = Soma + parseInt(strCPF.substring(i-1, i)) * (11 - i);
	Resto = (Soma * 10) % 11;
	
    if ((Resto === 10) || (Resto === 11))  Resto = 0;
    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 * 10) % 11;
	
    if ((Resto === 10) || (Resto === 11))  Resto = 0;
    if (Resto !== parseInt(strCPF.substring(10, 11) ) ) return false;
    return true;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-group">
  <label class="control-label">Nome completo do condutor principal do veículo: *</label>
  <input id="nome_principal_condutor" name="nome_principal_condutor" placeholder=" " type="text" class="form-control" required>
</div>
<div class="form-group">
  <label class="control-label">CPF do principal condutor *</label>
  <input id="cpf_principal_condutor" name="cpf_principal_condutor" placeholder="123.456.789-00" onblur="validaCPF2(this);" type="text" class="form-control" required>
  <small id="errocpf2" style="color: #a94442; display:none;" class="help-block">O CPF informado é inválido</small>
</div>

3
  • 1
    Perfeito @Sam muito obrigado pela ajuda. 31/12/2018 às 15:58
  • 1
    perfeito tio sam
    – user60252
    31/12/2018 às 16:45
  • @LeoCaracciolo valeu vovô
    – Meu ovo
    31/12/2018 às 17:08

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 .