Dynamic mask for CPF, CNPJ and CEI fields

Asked

Viewed 66 times

-3

Hello, I looked for this doubt in the questions, but I could not find it. Well, I would like to make a field to have the masks of CPF and CNPJ and CEI. depending on the number of characters typed. Here it doesn’t work totally well, because with several tests I did here, this my code didn’t work that I need. I don’t know if I should just change, or if I need to make another.

The format of the ERC is: 00.000.00000/00

I tried this code, but without any success:

$(".cpf_cnpj_cei").mask("000.000.000-00", {
  onKeyPress: function(cpfcnpj, e, field, options) {
    const masks = ["000.000.000-00", "00.000.00000/00", "00.000.000/0000-00"];
    let mask = null;
    if (cpfcnpj.length < 14) {
      mask = masks[0];
    } else if (cpfcnpj.length > 14 && cpfcnpj.length < 18) {
      mask = masks[1];
    } else if (cpfcnpj.length > 18) {
      mask = masks[2];
    }
    $(".cpf_cnpj_cei").mask(mask, options);
  }
});
<input class="cpf_cnpj_cei" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.15/jquery.mask.min.js"></script>

REFERENCES
Mask for CPF and CNPJ in the same field. Mask for CPF and CNPJ in the same field
CIS generator: https://theonegenerator.com/pt/geradores/documentos/gerador-de-cei
jQuery Mask Plugin A plugin to make masks on form Fields. https://igorescobar.github.io/jQuery-Mask-Plugin/

  • 2

    I took into account in the closing as duplicate the fact that the answer is practically the same that had already been posted on the given link, taking away the adjustments. To understand what kind of question serves the site and, consequently, avoid closures and negativities worth reading What is the Stack Overflow and the Stack Overflow Survival Guide (summarized) in Portuguese. Customization for very specific cases does not eliminate the feature of duplication (and not quite the purpose of the site).

1 answer

0


Mask limits the number of characters, as you start with a Cpf mask "000.000.000-00" the input will never have more than 14 characters. Put the masks with an extra zero, so that the user can continue typing.

And in this case specifically and modify/simplify the logics to be "less or equal" and the latter to a Else, now as soon as the 16th character is typed it already shows the CNPJ mask

$(".cpf_cnpj_cei").mask("000.000.000-00", {
  onKeyPress: function(cpfcnpj, e, field, options) {
    const masks = ["000.000.000-000", "00.000.00000/000", "00.000.000/0000-00"];
    let mask = null;
    if (cpfcnpj.length <= 14) {
      mask = masks[0];
    } else if (cpfcnpj.length <= 15) {
      mask = masks[1];
    } else {
      mask = masks[2];
    }
    $(".cpf_cnpj_cei").mask(mask, options);
  }
});
<input class="cpf_cnpj_cei" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.15/jquery.mask.min.js"></script>

  • Great! That’s exactly it! Thank you very much. How do people negatively answer a question like that if they answer the question exactly?! I don’t understand that. It will be if you at least read the question, clicked on the blue button called "Run"?

  • 1

    @Taffarelxavier , I did not deny the answer, but I think it is because it does not work pro CEI, when Voce enters the last number of CEI, he breaks pro CNPJ

  • 3

    The negativity is because this kind of question and answer does not fit very well with the optimal use of the platform, and a lot of people just negative instead of leaving comments on how to improve the question, and leave it wider to be more useful

  • 1

    Ai as it is a very specific problem with a specific answer happens some negativations, about the IEC error increase the <=15 to <=16.

  • 1

    Let me be quite frank: all right, it’s a direct negative. But if it’s not about helping people solve their problems, none of that is worth anything. And even though some people didn’t accept the answer, I ran several tests, and it worked perfectly for me. Anyway, you may be so negative that I have to delete the question, but my problem has been solved, and that’s all I need. Other people can be helped too. The rest is the rest. Because they did not try to solve the question?

  • By the way @Cmtecardeal the CEI is right, the mask has an extra digit not to limit the typing, but if you type a real CEI the mask is right

  • 2

    Yes @Taffarelxavier agree, the staff exaggerates a little, your question is well written with example code, will help other people.

  • @Even Sergiocarvalho, I got it wrong.

Show 3 more comments

Browser other questions tagged

You are not signed in. Login or sign up in order to post.