Locale

Change the locale of the datepicker, schedule and client side validation messages.

Language
English
English
English
French
German
German
German
Italian
Korean
Spanish
Catalan
Dutch
Portuguese
Portuguese
Arabic
Arabic
Bulgarian
Bangla
Bosnian
Czech
Greek
Estonian
Persian
Finnish
Danish
Hindi
Indonesian
Icelandic
Croatian
Japanese
Hungarian
Hebrew
Georgian
Central Kurdish
Khmer
Kyrgyz
Kazakh
Lithuanian
Latvian
Malay
Norwegian
Polish
Romanian
Russian
Slovak
Slovenian
Serbian
Serbian
Swedish
Thai
Turkish
Ukrainian
Uzbek
Vietnamese
Chinese
Chinese

Input Style

Themes

PrimeUIX
Aura Light Emerald Aura Light Emerald
Aura Dark Emerald Aura Dark Emerald
PrimeOne
Saga Blue Saga Blue
Vela Blue Vela Blue
Arya Blue Arya Blue
Bootstrap
Bootstrap Blue Light Bootstrap Blue Light
Bootstrap Purple Light Bootstrap Purple Light
Bootstrap Blue Dark Bootstrap Blue Dark
Bootstrap Purple Dark Bootstrap Purple Dark
Material Design
Material Indigo Light Material Indigo Light
Material Deep Purple Light Material Deep Purple Light
Material Indigo Dark Material Indigo Dark
Material Deep Purple Dark Material Deep Purple Dark
Material Design Compact
Material Compact Indigo Light Material Compact Indigo Light
Material Compact Deep Purple Light Material Compact Deep Purple Light
Material Compact Indigo Dark Material Compact Indigo Dark
Material Compact Deep Purple Dark Material Compact Deep Purple Dark
Legacy
Nova Light Nova Light
Nova Dark Nova Dark
Nova Colored Nova Colored
Luna Amber Luna Amber
Luna Blue Luna Blue
Luna Green Luna Green
Luna Pink Luna Pink

InputNumber

InputNumber formats input fields with numeric Strings. It supports currency symbols, minimum and maximum value, negative numbers, and a lot of round methods.

InputNumber Tag Documentation

InputNumber is an extension to the InputText with optimized handling for numbers.

NameTypeRequiredDefaultDescription
id String false generated Unique identifier of the component in a namingContainer.
rendered boolean false true Boolean value to specify the rendering of the component, when set to false component will not be rendered.
binding UIComponent false generated An EL expression referring to a server side UIComponent instance in a backing bean.
widgetVar String false generated ('widget_' + componentClientId) Name of the client side widget.
accesskey String false Access key to transfer focus to the input element.
alt String false Alternate textual description of the input field.
ariaDescribedBy String false Identifies the element(s) that describe the object, enhancing accessibility.
ariaLabelledBy String false
autocomplete String false Controls browser autocomplete behavior. Possible values are 'on', 'off', and 'new-password'.
caretPositionOnFocus String false Defines where the caret should be positioned on focus. Options: 'start', 'end', 'decimalLeft', 'decimalRight'.
converter Converter false EL expression resolves to a converter instance or literal converter ID defining a component converter.
converterMessage String false Custom message to display when conversion fails.
decimalPlaces String false 2 Number of decimal places. If the value is a Byte/Short/Integer/Long/BigInteger it defaults to 0.
decimalPlacesRawValue Integer false Specifies the number of decimal places to retain for the raw value, while decimalPlaces is used for the displayed value. If left as null, the decimalPlaces value is used. Note: setting this to fewer decimal places than those displayed may cause user confusion.
decimalSeparator String false Decimal separator character. Defaults to locale-specific separator if not specified.
decimalSeparatorAlternative String false Allows declaring an alternative decimal separator which is automatically replaced by decimalSeparator when typed.
dir String false ltr Direction indication for text that does not inherit directionality.
disabled boolean false false Specifies that an element should be disabled.
emptyValue String false focus Defines what to display when the input value is empty. Options: 'empty' (or null) to display nothing, 'focus' to display the symbol on focus, 'press' to display the symbol while a key is pressed, 'always' to always display the symbol, 'min' or 'max' to display the minValue/maxValue, 'zero' to display zero, or a string representing a number.
immediate boolean false false When set true, process validations logic is executed at apply request values phase for this component.
inputStyle String false Inline style of the input element.
inputStyleClass String false Style class of the input element.
inputmode String false Specifies the type of data expected in the input, aiding virtual keyboards.
label String false A localized user presentable name.
lang String false Specifies the language of the element's content.
leadingZero String false allow Controls leading zero behavior. Options: 'allow' to allow the leading zero while typing and remove it on focus out, 'deny' to prevent the leading zero from being entered, 'keep' to allow and keep the leading zero.
localValueSet boolean false false Indicates whether the local value of the component has been set.
maxValue String false 10000000000000 Maximum value allowed. WARNING: if maxValue is lower than 0, you effectively prevent your users from entirely deleting the content of their input.
maxlength int false Integer.MIN_VALUE Defines the maximum number of characters allowed in the input.
minValue String false -10000000000000 Minimum value allowed. WARNING: if minValue is greater than 0, you effectively prevent your users from entirely deleting the content of their input.
modifyValueOnUpDownArrow boolean false true Allows the user to increment or decrement the element value with the up and down arrow keys.
modifyValueOnWheel boolean false true Allows the user to increment or decrement the element value with the mouse wheel.
onblur String false Fires when an element loses focus.
onchange String false Fires when the value of an element has been changed.
onclick String false Fires when a mouse click on the element.
oncontextmenu String false Script to execute when the context menu is triggered.
oncopy String false Script to execute when content is copied from the element.
oncut String false Script to execute when content is cut from the element.
ondblclick String false Fires when a mouse double-click on the element.
ondrag String false Script to execute when an element is dragged.
ondragend String false Script to execute at the end of a drag operation.
ondragenter String false Script to execute when a dragged element enters a valid drop target.
ondragleave String false Script to execute when a dragged element leaves a valid drop target.
ondragover String false Script to execute when a dragged element is over a valid drop target.
ondragstart String false Script to execute at the start of a drag operation.
ondrop String false Script to execute when a dragged element is dropped.
onfocus String false Fires when an element gets focus.
oninput String false Script to execute when the element receives user input.
oninvalid String false Script to execute when the element's value is invalid.
onkeydown String false Fires when a user is pressing a key.
onkeypress String false Fires when a user presses a key.
onkeyup String false Fires when a user releases a key.
onmousedown String false Fires when a mouse button is pressed down on an element.
onmousemove String false Fires when the mouse pointer is moving while it is over an element.
onmouseout String false Fires when the mouse pointer moves out of an element.
onmouseover String false Fires when the mouse pointer moves onto an element.
onmouseup String false Fires when a mouse button is released over an element.
onpaste String false Script to execute when content is pasted into the element.
onreset String false Script to execute when the form is reset.
onscroll String false Script to execute when the element is scrolled.
onsearch String false Script to execute when a search is performed.
onselect String false Script to execute when text is selected.
onwheel String false Script to execute when the mouse wheel is used.
padControl String false true Allow padding the decimal places with zeros. If set to 'true' it will always pad the decimal places with zeros, and never if set to 'false'. If set to 'floats', padding is only done when there are some decimals (up to the number of decimal places from the decimalPlaces attribute). If set to an integer greater than 0, padding will use that number for adding the zeros; 0 is not a valid value.
placeholder String false Specifies a short hint describing the expected value of the input.
readonly boolean false false Specifies that an input field is read-only.
required boolean false false Marks component as required.
requiredMessage String false Custom message to display when the required validation fails.
role String false Defines the role of the element for accessibility purposes.
roundMethod String false S Controls the rounding method. Options: 'S' for round-half-up symmetric, 'A' for round-half-up asymmetric, 's' for round-half-down symmetric, 'a' for round-half-down asymmetric, 'B' for round-half-even (banker's rounding), 'U' for round up (away from zero), 'D' for round down (toward zero), 'C' for round to ceiling (toward positive infinity), 'F' for round to floor (toward negative infinity), 'N05' or 'CHF' for round to the nearest 0.05, 'U05' for round up to the next 0.05, 'D05' for round down to the next 0.05.
selectOnFocus boolean false true Defines if the element value should be selected on focus.
signPosition String false Placement of the negative/positive sign relative to the symbolPosition option. The sign is placed on either side of the symbolPosition, which can be placed on either side of the numbers. Options: 'p' for prefix, 's' for suffix, 'l' for left, 'r' for right.
size int false Integer.MIN_VALUE Number of characters used to determine the width of the input element.
style String false Specifies an inline CSS style for an element.
styleClass String false Specifies one or more CSS class names for an element.
submittedValue Object false
symbol String false none Desired symbol or unit to display, e.g. '$' or ' kg'.
symbolPosition String false p Position of the symbol. Options: 'p' for prefix, 's' for suffix.
tabindex String false Specifies the tab order of an element.
thousandSeparator String false Thousand separator character. Defaults to locale-specific separator if not specified.
title String false Specifies extra information about an element (displayed as a tooltip).
type String false text Input field type.
valid boolean false true Indicates whether the input's value is valid.
validator Validator false A method expression referring to a method validating the input.
validatorMessage String false Custom message to display when validation fails.
value Object false Value of the component.
valueChangeListener ValueChangeListener false A method binding expression referring to a method for handling a valuchangeevent.
Loading...
Tag DocumentationNew DocumentationNew Documentation JSDoc

Usage


<div class="card">
    <h:form>
        <div class="ui-fluid formgrid grid">
            <div class="field col-12 md:col-4">
                <p:outputLabel for="input1" value="No Configuration"/>
                <p:inputNumber id="input1" value="#{inputNumberView.input1}" modifyValueOnWheel="false" />
            </div>

            <div class="field col-12 md:col-4">
                <p:outputLabel for="input2" value="Currency"/>
                <p:inputNumber id="input2" value="#{inputNumberView.input2}" symbol=" CHF"
                                symbolPosition="s" decimalSeparator="," thousandSeparator="." />
            </div>

            <div class="field col-12 md:col-4">
                <p:outputLabel for="input3" value="Min-Max"/>
                <p:inputNumber id="input3" value="#{inputNumberView.input3}" minValue="-1000.999"
                                maxValue="1000" decimalPlaces="3" />
            </div>

            <div class="field col-12 md:col-4">
                <p:outputLabel for="input4" value="Custom Decimals"/>
                <p:inputNumber id="input4" value="#{inputNumberView.input4}" decimalPlaces="6" />
            </div>

            <div class="field col-12 md:col-4">
                <p:outputLabel for="input5" value="Empty Display - Blank"/>
                <p:inputNumber id="input5" value="#{inputNumberView.input5}" symbol="%"
                                symbolPosition="s" required="true" emptyValue="empty" />
            </div>

            <div class="field col-12 md:col-4">
                <p:outputLabel for="input6" value="Empty Display - Zero"/>
                <p:inputNumber id="input6" value="#{inputNumberView.input6}" symbol="%"
                                symbolPosition="s" emptyValue="zero" />
            </div>

            <div class="field col-12 md:col-4">
                <p:outputLabel for="input7" value="Empty Display - Symbol"/>
                <p:inputNumber id="input7" value="#{inputNumberView.input7}" symbol="%"
                                symbolPosition="s" emptyValue="always" />
            </div>

            <div class="field col-12 md:col-4">
                <p:outputLabel for="input8" value="Big Decimal"/>
                <p:inputNumber id="input8" value="#{inputNumberView.input8}" decimalPlaces="15" />
            </div>

            <div class="field col-12 md:col-4">
                <p:outputLabel for="input9" value="Positive"/>
                <p:inputNumber id="input9" value="#{inputNumberView.input9}" minValue="1" decimalPlaces="0" />
            </div>
        </div>
    </h:form>
</div>