CODEWITHSUNDEEP
validationjsfjsf-2inputdecimal
abhi
abhi

Reputation: 1614

Accept only digits for h:inputText value

Is there a way to confirm the value of an h:inputText in JSF, which should accepts only digits. Means it can be an Integer or the float.

If I type 12s3a562.675 , a5678s12 , 68712haf.563345 or any other such kind of values, then it should show an error. Otherwise it accepts and proceeds.

Upvotes: 19

Views: 114222

Answers (11)

Jasper de Vries
Jasper de Vries

Reputation: 20263

If you are just looking for integer values, you could use JSF 2.2 passthrough attributes to use input type="number" like this:

<html xmlns:a="http://xmlns.jcp.org/jsf/passthrough">

<h:inputText a:type="number" value="#{bean.integer}" />

Upvotes: 1

YoYo
YoYo

Reputation: 9415

If you are willing to use Primefaces, You can attach a <p:keyFilter> to either a <h:inputText> or <p:inputText>.

Example:

<h:inputText id="text1" value="#{bean.intValue}" />
<p:keyFilter for="text1" mask="pint" />

<p:inputText id="text2" value="#{bean.numberValue}" >
  <p:keyFilter mask="num" />
</p:inputText>

This will block keyboard input to allow only valid integer (int/pint) or decimal (num/pnum) input. The pnum and pint types only allows positive input (no sign).

Upvotes: 7

Mehrdad
Mehrdad

Reputation: 1

Instead of PrimeFaces Extension for you can use now!

https://www.primefaces.org/showcase/ui/input/inputNumber.xhtml

Upvotes: 0

Daniel Azamar
Daniel Azamar

Reputation: 692

This is working for me

onkeypress="if( (event.which &lt; 48 || event.which &gt; 57) ) return false;"

Upvotes: 7

diego matos - keke
diego matos - keke

Reputation: 2109

If you add this to your xhtml

xmlns:pe="http://primefaces.org/ui/extensions"

and use the inputext for numbers of Primefaces Extensions called pe:inputNumber , which not only validate your numbers but decimals also, may be more complete.

<pe:inputNumber value="#{beanTest.myValue}" thousandSeparator="" decimalSeparator="." decimalPlaces="0" />

Upvotes: 13

BalusC
BalusC

Reputation: 1109715

Just bind the input value to a Double, or better, BigDecimal property instead of String.

private BigDecimal number; // Double can also, but beware floating-point-gui.de

<h:inputText value="#{bean.number}" />

JSF has builtin converters for those types which will kick in automatically. You can customize the converter message as below:

<h:inputText value="#{bean.number}" converterMessage="Please enter digits only." />

Upvotes: 22

prageeth
prageeth

Reputation: 7415

Try this

<h:inputText>
   <f:validateRegex pattern="\d*(.\d+)?"/>
</h:inputText>

Upvotes: -1

dasLort
dasLort

Reputation: 1294

<h:inputText onkeypress="if(event.which &lt; 48 || event.which &gt; 57) return false;"/> is a short way if you want to accept integers only.

It has the advantage over type="number" that you can't even enter a non-digit

Upvotes: 26

Vasil Lukach
Vasil Lukach

Reputation: 3748

Try

<h:inputText value="SomeValue" converter="javax.faces.Double" />

Upvotes: 6

Simon
Simon

Reputation: 6363

Here are some different options:

  • You can use @Digits from bean validation.
  • You can use f:convertNumber.
  • You can validate the input in a backing bean method (you'll easily find tutorials for this)
  • If jsf 2.2 and html5 is an option for you, you can use <input type="number" />
  • Or you can use your own Javascript validation.

I think that the best options are either using Bean validation, f:convertNumber or going with HTML5 as these are the cleanest and give you the least redundant code.

Upvotes: 4

Arturo Volpe
Arturo Volpe

Reputation: 3637

You can use a JS validation

First, you need to define a JS function to validate the input

function validateInput(regexString) {
    var theEvent = window.event || event;
    var key = theEvent.keyCode || theEvent.which;
    if (key >= 46) {
        key = String.fromCharCode(key);
        var regex = new RegExp("^" + regexString + "$");
        if (!regex.test(key)) {
            theEvent.returnValue = false;
            if (theEvent.preventDefault) {
                theEvent.preventDefault();
            }
        }
    }
}

Second, in your h:input, capture the onKeyPress event and call the function

<h:inputText value="..." onKeyPress="validateInput('[0-9]*')/>

And it will only let you enter numbers.

You can easily extend this use to other case when you need to validate whit other regex.

Note, this only work with key press, if you want to capture other user event, use the proper tag.

Cheers

Upvotes: 2

Related Questions