Restrict user to type numbers or alphabets in input type

Question

Is there any way to restrict the user from typing the wrong sequence, I mean that user is allowed to type first two character as alphabets only, then the next two as number and the next two as character and then the rest 4 as number. Basically I want to apply restriction on the sequence of the character. The format of the Indian vehicle registration number should not be altered with wrong entries. sample output should be

HR 23 DU 2323

vehicleNumberFormat() {
    const { value } = this.myForm.get('vehicleNumber');
    console.log('value', value);

    const regex = /^(\w{0,2})(\w{0,2})(\w{0,2})(\w{0,4})$/g
    // const onlyNumbers = value.replace(/[^\d]/g, '')
    const typedValue = value.replace(/[^\w]/g, '')

    const formatedVehicleNumber = typedValue.replace(regex, (regex, $1, $2, $3, $4) =>
      [$1, $2, $3, $4].filter(group => !!group).join(' ')
    )

    console.log('formatedVehicleNumber-->', formatedVehicleNumber.toUpperCase())
    this.myForm.controls['vehicleNumber']?.setValue(formatedVehicleNumber.toUpperCase());
    
    return formatedVehicleNumber;
  }

here the codebase stackblitz

Should be `/^([a-z]{2})(\d{2})([a-z]{2})(\d{2})$/gi` I believe — Mingwei Samuel, Sep 12 '20 at 08:18
And I guess you want something related to this https://stackoverflow.com/a/26202266/2398020 to handle typing into the form? — Mingwei Samuel, Sep 12 '20 at 08:19
@MingweiSamuel it's not working, i have tried out. thanks for the response :-) — Nitesh Baghel, Sep 12 '20 at 08:23

score 1 · Answer 1 · answered Sep 12 '20 at 09:36

1

I think following regex should suffice your need

^([a-zA-Z]{2})\s+(\d{2})\s+([a-zA-Z]{2})\s+(\d{4})$

answered Sep 12 '20 at 09:36

Kousik Mandal

686
1
6
15

Restrict user to type numbers or alphabets in input type

1 Answers1