How to restrict an input to a variable amount of numbers only with PrimeFaces inputMask element

Question

I need to define something similar to this regex:

[0-9]{1, 5}

On a PrimeFaces <inputMask> element:

<p:inputMask mask="regexGoesHere" value="#{someBean.val}"/>

I looked at the PrimeFaces showcase, but I couldn't figure out how to do it.

So does anyone know how to do it in any way besides JavaScript ?

I'm not exactly looking for a solution with <inputMask> anything that would restrict me from typing letters in the input on the client side is OK.

Thanks

Bashemath

Answer 1

If you want or need to limit the length too, you could do something like this:

<p:inputMask 
   mask="9?9999"
   maxlength="5"
   slotChar=" "
   value="#{someBean.val}" />

where the user can only enter 1 to 5 digits, or the following for four digits and so on

<p:inputMask 
   mask="9?999"
   maxlength="4"
   slotChar=" "
   value="#{someBean.val}" />

Prior to PrimeFaces 5.1: use placeHolder instead of slotChar (Issue 7324).

Muscovite

Those information can usually be found in PrimeFaces documenation. – Kaiserslautern

Answer 2

The following Masked Input Plugin is the original jquery plugin that is being used by Primefaces , you can find much more information about its usage, also there are several p:input-mask code example in this PDF PrimeFaces: More Input Elements look at page 24

Repand

PrimeFaces: More Input Elements Link broken. – Daman

@SubodhJoshi , link fixed – Repand

THANKS FOR QUICK FIX. – Daman

Answer 3

KeyFilter from PrimeFaces Extensions looks exactly as something you need: http://fractalsoft.net/primeext-showcase-mojarra/views/keyFilter.jsf

According to documentation and example, it is driven by regexp, and functions exactly as it should: blocking the ability to type something not passing to the regexp.

Joyance

Answer 4

just try this :

<p:inputMask maxlength="5">
        <pe:keyFilter regEx="/[\d]/" />
</p:inputMask>

maxlength : limit the number of caracters to 5 max regEx : only authorize decimal caracter on key press

nb:

Statute

Nothing in the question indicates that OP is using PrimeFaces Extensions. Therefore, this "try this" answer is confusing and worthless without a clear elaboration of the solution in words. – Prissie

u r quite rude with your comment @Prissie . i edited my answer so – Statute

I just care about the quality of Stack Overflow, on contrary to all those people who post "try this" answers without teaching/explaining anything (being unable to teach/explain is a strong hint that you actually also don't exactly understand it by yourself). Teach how to fish instead of directly giving the fish. Otherwise the world ends up with only people who can't teach to fish anymore. If you find that rude, then that's just sad. – Prissie

good answer ... but not necessary to low score for workaround – Statute

Answer 5

You could use a validator. Or the validaterange and define a minimum and maximum.

Soapberry

validaterange is an attribute or an element or what ? If by validator you mean server side validation I already use the hibernate validator through the javax.validate annotations, but I want to restrict the user to pressing only number keys on the clinet. – Bashemath

<h:inputText id="kms" value="#{bean.kms}"> <f:validateDoubleRange minimum="#{bean.distanceMinValue}" maximum="#{bean.distanceMaxValue}"/> – Soapberry