arya-blue
luna-amber
luna-blue
luna-green
luna-pink
nova-dark
nova-light
saga-blue
vela-blue
Calculator
Calculator can be used to attach a popup calculator on specified input components. Examples below include h:inputText, p:inputText, and p:inputNumber components.

It can be embedded right in an input component or externally configured using the for="target" notation.
Calculator with defaults on h:inputText
Calculator scientifc layout on a p:inputText
Calculator with button on a p:inputNumber
Source

                <h:panelGrid columns="2">   
        <h:outputText value="Calculator with defaults on h:inputText"/>   
        <h:inputText id="hInputText" value="#{calculatorController.hInputText}">
            <pe:calculator/>
        </h:inputText> 
 
        <h:outputText value="Calculator scientifc layout on a p:inputText"/>   
        <p:inputText id="pInputText" value="#{calculatorController.pInputText}">
            <pe:calculator layout="scientific"/>
        </p:inputText> 
 
        <h:outputText value="Calculator with button on a p:inputNumber" /> 
        <p:inputNumber id="pInputNumber"  value="#{calculatorController.pInputNumber}" symbol=" $USD" symbolPosition="s" 
                               decimalSeparator="." thousandSeparator="," decimalPlaces="2" /> 
</h:panelGrid>

<pe:calculator for="pInputNumber" showOn="both" precision="2"/>
            
Components and more
Documentation pe:
Attributes (move mouse over the names to see data types)
Name Description
No attributes available for this component.
PrimeFaces Extensions Showcase - © 2011-2025,PrimeFaces: 15.0.13,PrimeFaces Extensions: 15.0.14-SNAPSHOT,JSF: Apache MyFaces JSF-2.3 Core Impl 2.3.10,Server: Apache Tomcat (TomEE)/9.0.82 (8.0.16),Build time: 2026-02-23 00:32