CPF mask error

Question

CPF mask error

Navigation

#1 by (4 votes)
#2 by (1 votes)

1

I created a form but when I put a mask in the CPF to stay like this Ex. (000.000.000-00) does not assign

<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="JS/funcoes.js"></script>
    <script src="JS/jquery-3.2.1.min.js"></script>
    <script src="jQuery-Mask-Plugin-master/src/jquery.mask.js"></script>
    <script src="JS/jquery-3.2.1.slim.min.js"></script>
</head>

if(event.keyCode !== 8){
        if(texto.length === 3 || texto.length === 7){
            document.getElementById("cpf").value == texto + ".";
        } else if(texto.length === 11){
            document.getElementById("cpf").value == texto + "-";
        }
    }

<form action="salvarregistro.php" method="POST">
            
 <input type="text" name="cpf" size="40" id="cpf" required="" placeholder="CPF xxx.xxx.xxx-xx" onkeyup="mascCPF(this.value)"><br><br>
            
            <button type="submit">Enviar dados</button>
            
            
        </form>

javascript html5

asked by anonymous 09.11.2017 / 18:45

2 answers

1

Another way to help if you are using bootstrap is to do it in a very simple way. But to work it must have imported the library jQuery.mask

<script type="text/javascript" src="js/bootstrap-notify.min.js"></script>

<script type="text/javascript" src="js/jquery.mask.min.js"></script>

<script type="text/javascript">
    $(document).ready(function(){
        $('#cpf').mask('000.000.000-00');
        $('#rg').mask('00.000.000-0');
    });
</script>

<div class="col-lg-12">                             
    <div class="col-lg-5">
        <label for="ex1">CPF:</label>
        <input type="text" class="form-control" id="cpf" maxlength="11"  name="cpf" placeholder='___.___.___-__'><br>
    </div>
</div>

<div class="col-lg-12">  
  <div class="col-lg-5">
       <label for="ex1">RG:</label>
       <input type="text" class="form-control" id="rg" maxlength="9"  name="rg" placeholder='__.___.___-_'><br>
  </div>
</div>

09.11.2017 / 19:05

Locate for two fields Access files in C: \\ giving error: Access to path (...) was denied

score 4 · Accepted Answer

Pro your code you can try this:

function mascCPF(texto) {
  if(event.keyCode != 8) {
    if(texto.length === 3 || texto.length === 7) {
        document.getElementById("cpf").value = texto + ".";
    } else if(texto.length === 11){
        document.getElementById("cpf").value = texto + "-";
    }
  }
}

<form action="salvarregistro.php" method="POST">
            
 <input type="text" name="cpf" size="40" maxlength="14" id="cpf" required="" placeholder="CPF xxx.xxx.xxx-xx" onkeydown="mascCPF(this.value)"><br><br>
            
            <button type="submit">Enviar dados</button>
            
            
        </form>

But I recommend you use a library to do this, I point out this: jQuery-Mask-Plugin .

EDIT:

With jQuery-Mask-Plugin:

window.onload = function() {
  $('#cpf').mask('999.999.999-99');
}

<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>

<form action="salvarregistro.php" method="POST">
            
 <input type="text" name="cpf" size="40" id="cpf" required="" placeholder="CPF xxx.xxx.xxx-xx"><br><br>
            
    <button type="submit">Enviar dados</button>


</form>