campo NIF

[John Hebert Trindade]

Bem cá estou eu outra vez.

Tenho um campo para o NIF português, mas o que pode acontecer é de ter que inserir o NIF de outro pais.

Até aqui tudo bem, pois tenho uma função em javascript que verifica se o NIF esta correcto e se é português ou não, neste post: 

https://www.portugal-a-programar.pt/forums/topic/80088-validação-nif/#comment-632350

O NIF português neste momento é composto por 9 dígitos e costumamos separar por pontos a cada 3 dígitos. Ex. 123.456.789

Tenho o campo da seguinte forma:

<input type="text" name="numero_nif" id="numero_nif" data-js="nif" maxlength="11" class="input-adm" placeholder="###.###.###" value="<?php echo $numero_nif; ?>">

E esta sendo validade por javascript da seguinte forma:

const masks = {
  
  nif(value) {
    return value
      .replace(/\D+/g, '')
      .replace(/(\d{3})(\d)/, '$1.$2')
      .replace(/(\d{3})(\d)/, '$1.$2')
      .replace(/(.\d{3})\d+?$/, '$1')
  },
}

document.querySelectorAll('input').forEach(($input) => {
  const field = $input.dataset.js

  $input.addEventListener(
    'input',
    (e) => {
      e.target.value = masks[field](e.target.value)
    },
    false
  )
})

O que necessito é o seguinte, tenho um campo onde digito as iniciais do pais do NIF ex. "PT" ou "BR" caso fosse digitado PT ele fazia as configurações acima, no caso de digitar BR ou outro pais ficasse livre.

Penso que tera que ser em javascript também porque terá que ser verificado no ato de digitar o pais.

[Cerzedelo]

Em 07/12/2023 às 15:16, John Hebert Trindade disse:

Bem cá estou eu outra vez.

Tenho um campo para o NIF português, mas o que pode acontecer é de ter que inserir o NIF de outro pais.

Até aqui tudo bem, pois tenho uma função em javascript que verifica se o NIF esta correcto e se é português ou não, neste post: 

https://www.portugal-a-programar.pt/forums/topic/80088-validação-nif/#comment-632350

O NIF português neste momento é composto por 9 dígitos e costumamos separar por pontos a cada 3 dígitos. Ex. 123.456.789

Tenho o campo da seguinte forma:

<input type="text" name="numero_nif" id="numero_nif" data-js="nif" maxlength="11" class="input-adm" placeholder="###.###.###" value="<?php echo $numero_nif; ?>">

E esta sendo validade por javascript da seguinte forma:

const masks = {
  
  nif(value) {
    return value
      .replace(/\D+/g, '')
      .replace(/(\d{3})(\d)/, '$1.$2')
      .replace(/(\d{3})(\d)/, '$1.$2')
      .replace(/(.\d{3})\d+?$/, '$1')
  },
}

document.querySelectorAll('input').forEach(($input) => {
  const field = $input.dataset.js

  $input.addEventListener(
    'input',
    (e) => {
      e.target.value = masks[field](e.target.value)
    },
    false
  )
})

O que necessito é o seguinte, tenho um campo onde digito as iniciais do pais do NIF ex. "PT" ou "BR" caso fosse digitado PT ele fazia as configurações acima, no caso de digitar BR ou outro pais ficasse livre.

Penso que tera que ser em javascript também porque terá que ser verificado no ato de digitar o pais.

Não seria mais pratico colocar dois campos distintos, um para o país e outro para o nif.

Depois com javascript verifica se o valor do campo país foi preenchido com PT chama a validação se for com outro pais não faz validação.

Tenha atenção que existem regras para validação do nif, pode ver em javascript https://gist.github.com/eresende/88562d2c4dc85b62cb0c

 

[John Hebert Trindade]

@Cerzedelo são dois campos distintos e o de verificação já esta implementado e a funcionar perfeitamente, preciso é de implementar para a mascara.

A lógica acho que seria assim:

Se o campoPais = "PT"

    campoNIF.mascara = "###.###.###"

    campos.maxlength = 11

senão

   campoNIF.mascara = ""

  campos.maxlength = 21

fim

acho que deveria ser em javascript com a opção onchange

[John Hebert Trindade]

até fiz isso, mas não resulta

nif(value) {
    const masknif = document.getElementById('nif_pais').value
    console.log("masknif");
    if (masknif == "PT" ){
      document.getElementById('numero_nif').length = 11;
    return value
      .replace(/\D+/g, '')
      .replace(/(\d{3})(\d)/, '$1.$2')
      .replace(/(\d{3})(\d)/, '$1.$2')
      .replace(/(.\d{3})\d+?$/, '$1')
    }else{
      document.getElementById('numero_nif').length = 21;
      return value
    }
}

 

[Cerzedelo]

Em 07/12/2023 às 16:38, John Hebert Trindade disse:

@Cerzedelo são dois campos distintos e o de verificação já esta implementado e a funcionar perfeitamente, preciso é de implementar para a mascara.

A lógica acho que seria assim:

Se o campoPais = "PT"

    campoNIF.mascara = "###.###.###"

    campos.maxlength = 11

senão

   campoNIF.mascara = ""

  campos.maxlength = 21

fim

acho que deveria ser em javascript com a opção onchange

Sim pode utilizar o onchange

<html>
<body>

<p>Escolha o país</p>

<input id="pais" onchange=myFunction()>
<input id="nif">


<script>

function masknif(v){
    v=v.replace(/\D/g,"")                    
    v=v.replace(/(\d{3})(\d)/,"$1.$2")       
    v=v.replace(/(\d{3})(\d)/,"$1.$2")       
                                             
    v=v.replace(/(\d{3})(\d{1,2})$/,"$1-$2") 
    return v
}

function myFunction() {
  var x = document.getElementById("pais").value;
  if(x=="PT"){
  	document.getElementById("nif").value = masknif("122222222");
    }else{
    document.getElementById("nif").value = "";
    }
}
</script>

</body>
</html>

Mas se no formulário tiver muitos campos para validar pondere utilizar já uma biblioteca já preparada para esse efeito.

Exemplo: https://igorescobar.github.io/jQuery-Mask-Plugin/

[John Hebert Trindade]

Gostei do seu exemplo e até prefiro fazer esse do que o que tenho, mas como coloco para ir formatando consoante vou digitando? Porque até da para resolver outro post que aqui tenho.

Pois da forma que você colocou ele devolve o valor 1222222222 e como coloco para limitar o tamanho do campo com o maxlength?

Edited December 7, 2023 at 07:27 PM by John Hebert Trindade
faltou adicionar o tamanho do campo

[John Hebert Trindade]

Consegui resolver o tamanho do maxlength da seguinte forma:

function SetMaxLength() {
  const pais = document.getElementById('nif_pais').value;

  //-> Convertendo a String para maiúsculo.
  const paisnif = pais.toUpperCase();
  const input = document.getElementById("numero_nif");
  if (paisnif == 'PT'){
    input.maxLength = 11;
  }else  if(paisnif == 'BR'){
    input.maxLength = 14;
  }else{
    input.maxLength = 21;
  }
}

mas quando junto os dois códigos não funciona, preciso agora que conforme for digitando o numero ele formate automaticamente

exemplo:

PT = "###.###.###"

BR = "###.###.###-##"

Outros = sem formatação

Edited December 7, 2023 at 11:11 PM by John Hebert Trindade
Adicionei algo que faltava dizer

[John Hebert Trindade]

Bem depois de 12 horas a tentar e ver vários videos, consegui fazer da seguinte forma, não sei se é a melhor, mas esta funcionando, caso alguém consiga resumir o código agradeço.

Parte do código os méritos é do @Cerzedelo

Deixo aqui o código a funcionar. Para isso crie um arquivo js com o código abaixo e no input do numero do html chame a função myFunction com o evento onkeyup.

no campo input nif_pais chame a função SetMaxLength com o evento onchange.

Espero ajudar alguém, como todos aqui do fórum tem me ajudado

function SetMaxLength() {
  const pais = document.getElementById('nif_pais').value;

  //-> Convertendo a String para maiúsculo.
  const paisnif = pais.toUpperCase();
  const input = document.getElementById("numero_nif");
  if (paisnif == 'PT'){
    input.maxLength = 11;
    input.value = "";
  }else  if(paisnif == 'BR'){
    input.maxLength = 14;
    input.value = "";
  }else{
    input.maxLength = 21;
    input.value = "";
  }
}

function masknifpt(v){
  v=v.replace(/\D+/g, '')
  v=v.replace(/(\d{3})(\d)/, '$1.$2')
  v=v.replace(/(\d{3})(\d)/, '$1.$2')
  v=v.replace(/(.\d{3})\d+?$/, '$1')
  return v
}

function masknifbr(v){
  v=v.replace(/\D+/g, '')
  v=v.replace(/(\d{3})(\d)/, '$1.$2')
  v=v.replace(/(\d{3})(\d)/, '$1.$2')
  v=v.replace(/(\d{3})(\d)/, '$1-$2')
  v=v.replace(/(-\d{3})\d+?$/, '$1')
  return v
}

function masknifother(v){
  v=v.replace(/\D+/g, '')
  return v
}

function myFunction() {
  var x = document.getElementById("nif_pais").value;
  const paisnif = x.toUpperCase();
  var numero = document.getElementById("numero_nif").value;
  if(paisnif=="PT"){
  	document.getElementById("numero_nif").value = masknifpt(numero);
    }else if (paisnif=="BR"){
    document.getElementById("numero_nif").value = masknifbr(numero);
    }else{
      document.getElementById("numero_nif").value = masknifother(numero);
    }
}