Homepage
TriStateCheckbox
The TriStateCheckbox add a new state for a common SelectBooleanCheckbox. The value of TriStateCheckbox are mapped to 0,1,2 string values. This component can be customized with CSS classes for icons.

This example show pe:triStateCheckbox in action.
Basic Usage with title:
Ajax Behavior:
Customs Icons:
Item Label
Selected Values
Value 1: 2
Value 2:
Value 3:
Value 4: 1
Source
<p:growl id="growl" showDetail="true"/>

<h:panelGrid id="triStateGrid" columns="2" styleClass="centerContent">
    <h:outputText value="Basic Usage: "/>
    <pe:triStateCheckbox value="#{triStateCheckBoxController.value1}"/>

    <h:outputText value="Ajax Behavior: "/>
    <pe:triStateCheckbox id="ajaxTriState" value="">
        <p:ajax update="growl" listener="#{triStateCheckBoxController.addMessage}"/>
    </pe:triStateCheckbox>

    <h:outputText value="Customs Icons: "/>
    <pe:triStateCheckbox value="#{triStateCheckBoxController.value3}"
                         stateTwoIcon="ui-icon-plus"
                         stateThreeIcon="ui-icon-minus"/>
    
    <h:panelGroup/>
    <pe:triStateCheckbox value="#{triStateCheckBoxController.value4}" itemLabel="Item Label"/>                
</h:panelGrid>

<p:commandButton value="Submit" process="triStateGrid" update="display" oncomplete="PF('dlg').show()"
                 style="margin-top:10px;"/>

<p:dialog header="Selected Values" showEffect="fade" hideEffect="fade" widgetVar="dlg">
    <h:panelGrid id="display" columns="1" style="margin: 10px;">
        <h:outputText value="Value 1: #{triStateCheckBoxController.value1}"/>
        <h:outputText value="Value 2: #{triStateCheckBoxController.value2}"/>
        <h:outputText value="Value 3: #{triStateCheckBoxController.value3}"/>
        <h:outputText value="Value 4: #{triStateCheckBoxController.value4}"/>
    </h:panelGrid>
</p:dialog>
            
Components and more
Use Cases
Documentation pe:triStateCheckbox
Attributes (move mouse over the names to see data types)
Name Description
idUnique identifier of the component in a namingContainer.
rendered Boolean value to specify the rendering of the component, when set to false component will not be rendered.
bindingAn EL expression referring to a server side UIComponent instance in a backing bean.
valueValue of the component.
converter An EL expression or a literal text that defines a converter for the component. When it's an EL expression, it's resolved to a converter instance. In case it's a static text, it must refer to a converter id.
immediate When set true, process validations logic is executed at apply request values phase for this component. Default is false.
requiredMarks component as required.
validatorA method expression referring to a method validationg the input.
valueChangeListenerA method binding expression referring to a method for handling a valuchangeevent.
requiredMessageMessage to display when required field validation fails.
converterMessageMessage to display when conversion fails.
validatorMessageMessage to display when validation fails.
widgetVarName of the client side widget.
disabledDisable the component
labelUser label
onchangeCallback on change event
styleInline style of the component
styleClassCoontainer style class
stateOneIconIcon for StateOne as a css class.
stateTwoIconIcon for StateTwo as a css class.
stateThreeIconIcon for StateThree as a css class.
itemLabelLabel to display next to checkbox.
stateOneTitleTitle for StateOne.
stateTwoTitleTitle for StateTwo.
stateThreeTitleTitle for StateThree.
tabindexThe tab index to assign to the component, If not given, tabindex=0 will be assigned.
PrimeFaces Extensions Showcase - © 2011-2014, PrimeFaces: 5.2, PrimeFaces Extensions: 4.0.0-SNAPSHOT, JSF: mojarra 2.2.8, Server: Apache Tomcat/7.0.54, Build time: 2015-08-22 09:03
Theme
afterdark
afternoon
afterwork
aristo
black-tie
blitzer
bluesky
bootstrap
casablanca
cruze
cupertino
dark-hive
delta
dot-luv
eggplant
excite-bike
flick
glass-x
home
hot-sneaks
humanity
le-frog
midnight
mint-choc
overcast
pepper-grinder
redmond
rocket
sam
smoothness
south-street
start
sunny
swanky-purse
trontastic
ui-darkness
ui-lightness
vader
occured!
Message:
Timestamp:
StackTrace:
Developers
Thomas Andraschko andraschko.thomas@gmail.com
Oleg Varaksin ovaraksin@googlemail.com
Nilesh Namdeo Mali nileshmali86@gmail.com
Mauricio Fenoglio fenoglio.mauricio@gmail.com
Pavol Slaný pavol.slany@gmail.com
Sudheer Jonna sudheer.jonna@gmail.com