Uncaught TypeError when using the Jquery Mask Plugin

Navigation
2

I received the "Uncaught TypeError" error when using the jQuery "mask" function Mask Plugin.

Herearemyincludesinthefileeditar_usuario.php.

<scripttype="text/javascript" src="<?php echo $site."js/chama_ajax.js" ?>"></script>
<script type="text/javascript" src="<?php echo $site."js/jquery/jquery-3.2.1.min.js" ?>"></script>
<script type="text/javascript" src="<?php echo $site."js/jquery_mask_plugin/jquery.mask.min.js" ?>"></script>
<script type="text/javascript" src="<?php echo $site."js/validacoes.js" ?>"></script>
<script type="text/javascript" src="<?php echo $site."js/mascaras_edit.js" ?>"></script>
<script type="text/javascript" src="<?php echo $site."js/js.js" ?>"></script>

My masks code is in the file mascaras_edit.js : 

$(document).ready(function($) {
  $('#cep_edit').mask('00000-000');
  $('#telefone_edit').mask('(00) 0000-0000');
  $('#celular_edit').mask('(00) 00000-0000');
  $('#cnpj_edit').mask('00.000.000/0000-00', {reverse: true});
  $('#cpf_edit').mask('000.000.000-00', {reverse: true});
});

Here is the code (php / html) of the form where the mask function is being used. 

<div class="col-lg-6 form-group" id="cpf_div">
  <label>CPF</label>
  <input class="form-control" type="text" name="cpf_edit" id="cpf_edit" size="40" value="<?php echo $r['cpf'];?>">
</div>
<div class="col-lg-6 form-group">
  <label>Telefone Fixo</label>
  <input class="form-control" type="text" name="telefone_edit" id="telefone_edit" size="40" value="<?php echo $r['telefone'];?>">
</div>
<div class="col-lg-6 form-group">
  <label>Telefone Celular</label>
  <input class="form-control" type="text" name="celular_edit" id="celular_edit" size="40" value="<?php echo $r['celular'];?>">
</div>
<div class="col-lg-6 form-group" id="cep_div">
  <label>CEP</label>
  <input class="form-control" name="cep_edit" id="cep_edit" type="text" maxlength="9" size="40">
</div>

I tried to follow tips from other questions asked but nothing worked. I am trying to use the plugin in other parts of the code except in the editing form, I also tried to use the "masked" plugin function and it did not work (in that file).

    
asked by anonymous 12.11.2017 / 00:22

1 answer

3

Make sure the order of the libraries is correct. JQuery loading usually should always come before. See below for the working Mask Input. Make sure the other .js files are not causing any conflict (see if the console is experiencing any errors).

Also check that this variable $site is returning the correct path of the libraries (see source code). 

$(document).ready(function($) {
  $('#cep_edit').mask('00000-000');
  $('#telefone_edit').mask('(00) 0000-0000');
  $('#celular_edit').mask('(00) 00000-0000');
  $('#cnpj_edit').mask('00.000.000/0000-00', {reverse: true});
  $('#cpf_edit').mask('000.000.000-00', {reverse: true});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.12/jquery.mask.min.js"></script>
<div class="col-lg-6 form-group" id="cpf_div">
  <label>CPF</label>
  <input class="form-control" type="text" name="cpf_edit" id="cpf_edit" size="40" value="<?php echo $r['cpf'];?>">
</div>
<div class="col-lg-6 form-group">
  <label>Telefone Fixo</label>
  <input class="form-control" type="text" name="telefone_edit" id="telefone_edit" size="40" value="<?php echo $r['telefone'];?>">
</div>
<div class="col-lg-6 form-group">
  <label>Telefone Celular</label>
  <input class="form-control" type="text" name="celular_edit" id="celular_edit" size="40" value="<?php echo $r['celular'];?>">
</div>
<div class="col-lg-6 form-group" id="cep_div">
  <label>CEP</label>
  <input class="form-control" name="cep_edit" id="cep_edit" type="text" maxlength="9" size="40">
</div>
    
12.11.2017 / 00:41
how do I resolve the error Undefined property: stdClass :: Keyup () is not working?