1

Tenho a seguinte modal:

<div class="modal fade" id="anti_fraude_modal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
   <div class="modal-dialog" role="document">
      <div class="modal-content">
         <div class="modal-header">
            <h5 class="modal-title" id="exampleModalLabel">Digite seu CPF</h5>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
            </button>
         </div>
         <div class="modal-body">
            <input type="text" class="form-control cpf_antifraude masked-input" id="anti_fraude_cpf" name="anti_fraude_cpf">
         </div>
         <div class="modal-footer">
            <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancelar</button>
            <button type="button" class="btn btn-primary" id="anti_frade_continuar">Continuar...</button>
         </div>
      </div>
   </div>
</div>

E preciso aplicar a mascara no campo CPF. Tentei da seguinte forma:

$("#anti_fraude_modal").modal('show');
var $MaskedInput = $('.masked-input');
$MaskedInput.find('.cpf_antifraude').inputmask('999.999.999-99', { placeholder: '___.___.___-__' });    

Mas não aplicou a máscara, mas também não deu erro.

Eu iniciei a máscara quando carrego a página principal, normalmente.

1 Resposta 1

2

A maneira como você aplica a máscara está correta, o problema está na maneira com que define o elemento em que a máscara será aplicada.

Ao utilizar o método .find() você está procurando por descendentes do elemento, sendo que o $MaskedInput já é o próprio elemento que você procura.

Não deu nenhum erro porque simplesmente não foi encontrado nenhum elemento de acordo com aquele seletor.

No restante, seu código funciona perfeitamente.

/*var $MaskedInput = $('.masked-input');
$MaskedInput.find('.cpf_antifraude').inputmask('999.999.999-99', { placeholder: '___.___.___-__' });*/

var $MaskedInput = $('.masked-input');
$MaskedInput.inputmask('999.999.999-99', {
  placeholder: '___.___.___-__'
});
<script src="https://code.jquery.com/jquery-1.10.0.min.js"></script>
<script src="https://rawgit.com/RobinHerbots/Inputmask/3.x/dist/jquery.inputmask.bundle.js"></script>

<input type="text" class="form-control cpf_antifraude masked-input" id="anti_fraude_cpf" name="anti_fraude_cpf">

1
  • Ok, era isso mesmo, obrigado! :) Commented 5/03/2018 às 17:05

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 .