Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

224
Visualizações
Rejecting non digits in vue input

Does somebody knows how to implement a VUE input field that rejects entering non digits as the user tries to enter it.

Some kind of:

<b-form-input v-on:keypress="onlyNumber(...."

Thanks!

over 4 years ago · Santiago Trujillo
3 Respostas
Responde à pergunta

0

The easiest way would be to declare the input type to number. <b-form-input type="number" ...

over 4 years ago · Santiago Trujillo Relatório

0

Finally, for me, this do the job:

    <input v-on:keydown="onlyNumber($event)" ... />

    

onlyNumber: function(evt) { //0035621
        evt = (evt) ? evt : window.event;
        var charCode = (evt.which) ? evt.which : evt.keyCode;
        if (charCode > 31 && (charCode != 46 &&(charCode < 48 || charCode > 57))) {
            evt.preventDefault();
        } else {
            return true;
        }
    }
over 4 years ago · Santiago Trujillo Relatório

0

You can use keyCode of the key pressed on keydown event and perevent default behavior if keyCode isn't for a non digit key;

Vue input component:

<b-form-input @keydown="onlyNumbers" />

And the onlyNumbers method would be:

onlyNumbers(e) {
    if((e.keyCode < 48 || e.keyCode > 57) && (e.keyCode < 96 || e.keyCode > 105)) {
        e.preventDefault();
}

Related Links: keyCode values for numeric keypad, preventDefault, Keydown Event

over 4 years ago · Santiago Trujillo Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda