How to disable comma , dot and dash on the numeric keyboard?

Ionic Framework
1

We need to disable comma, dot, and dash from the numeric keyboard. We tried pattern="[0-9]*" inputmode=“numeric” type=“number”. Still, it allows entering dot and dash. How to solve this? Any Help will be appreciated.

2

Did anyone find the solution?

3

A regex with formcontrol is the solution. If.the user types an unsupported character gives an error message

4

Hi ciccilleju, Please give us regex. :grinning:

5

I think it is something you need to study a little bit,
this is an example:

import { Component, OnInit } from '@angular/core';
import { Validators, FormControl, FormGroup } from '@angular/forms';

@Component({
  selector: 'app-signup',
  templateUrl: './signup.page.html',
  styleUrls: ['./signup.page.scss'],
})
export class NumberExamplePage implements OnInit {


  numberForm: FormGroup;

  constructor() {
  }

  ngOnInit() {
    this.numberForm = new FormGroup({
      number: new FormControl('', [Validators.required, Validators.pattern('[0-9]*'), Validators.minLength(7)]),
    });
  }
}
Type a Number 
    <div class="error__message"
      *ngIf="( numberForm.get('number').hasError('minlength') || numberForm.get('number').hasError('maxlength') ||numberForm.get('number').hasError('pattern') ||numberForm.get('number').hasError('required') ) && numberForm.get('number').touched">
      <div class="error"
        *ngIf="numberForm.get('number').hasError('required') && numberForm.get('number').touched">
        Insert a phone number
      </div>

      <div class="error"
        *ngIf="numberForm.get('number').hasError('minlength') && numberForm.get('number').touched">
        Invalid Phone Number
      </div>
      <div class="error"
        *ngIf="numberForm.get('number').hasError('pattern') && numberForm.get('number').touched">
        Please insert only numbers
      </div>
    </div>
  </div>
``` ```
7

Hey ciccilleju! we are using ionic react

8

Ok, its about the same thing, take my code and do a refactoring for using with react