CODEWITHSUNDEEP
iosangularjsinputionic-frameworkangular-ngmodel
Jurjen Folkertsma
Jurjen Folkertsma

Reputation: 272

is it possible to allow spaces in "number" input angularjs

I am making an app using ionic framework -v1, now i found out when deploying my app to IOS the app seems to works perfectly fine at first.

But when i enter a space (using the mobile number keypad) in my input=[number] field the app starts flickering and loses the scopes with the space in them. Later when i want to push my data to angularfire it also completely stops working and wont let me push my data.

My input is as simple as this:

<input type="number" name="" ng-model="info.DriversLicensenr">

My customer would like the field to have spaces in them, but also the numbers keypad should show up when pressed in the app.

Is there any way to allow spaces? or to modify another input type to reach the desired effect?

Upvotes: 3

Views: 4660

Answers (3)

Zooly
Zooly

Reputation: 4787

This kind of input will open a number pad on mobile device. However, you will have to check that the user doesn't type other caracters than numbers.

<input type="text" inputmode="numeric" ng-model="ctrl.dLicence"/>

EDIT

<input type="text" pattern="[0-9\s]*"/>

This opens a number pad, but doesn't limit to numbers only.

Upvotes: 4

BKS
BKS

Reputation: 153

To restrict input to only numbers or space , use below code

<input type="text" inputmode="numeric" oninput="formatNumber(event)"/>

 function formatNumber(event){
    let value =  event.target.value || '';
    value = value.replace(/[^0-9 ]/,'');
    event.target.value = value;
 }

Upvotes: 0

Vikash Kumar
Vikash Kumar

Reputation: 1718

No that's not possible i will suggest you to use input type text and then use ng-pattern to validate it is number or not. This won't stop you from inserting characters but will show error it there's a character or any other special characters.

Upvotes: 0

Related Questions