Restricting Input Field to Numeric Values Only

kyecass · 2015-11-03 11:57:29 UTC

Hi all

I’m just wondering what the quickest way is to restrict an input field to numeric values only is?

I’ve tried changing the field input type to ‘number’ and ‘phone number’ however I have the following issues.

Number:

I don’t want the up/down increment buttons to display

Phone Number:

Allows the input of non numeric (alpha characters).

Additional Logic:

Essentially I’m looking for the user to input a numeric value here to 2 d.p as such I have some additional logic:

Initial field value is set to 0.00
On lost focus if blank sets text on field back to 0.00
On lost focus if .00 is not present in users entry this should append to the end of the users entered value
On mobile I want on focus the user to be presented with the numeric keypad

As such I believe the Phone Number field type is my best route to solve this however I’m struggling to restrict the input type to numeric only (I don’t want to allow input then remove after/on lost focus) as there will be a series of these field on a page which will be totalled as the user inputs values.

Any help much appreciated.

Thanks

Kyle
Field.rp (53.6 KB)

josephxbrick · 2015-11-03 15:05:51 UTC

Hi Kyle -

I don’t know how to make the numeric keyboard come up for mobile, but you can restrict entry of keys by testing for them OnKeyDown. Basically you test for various keys or key combinations; only keystrokes that don’t pass the test will be allowed. (You don’t need a command after the condition.)

The following will allow only numbers, the decimal place, and keystrokes that perform normal field operations (e.g., selecting all with ctrl+a, copying, pasting, etc.):