JSF Under the Hood—Part 1 - JSF and HTML5 - page 47

<h:outputText value="#{bundle['survey.user.sex']}"></h:outputText>
<h:selectOneMenu id="sex"
value="#{flash.sex}">
<f:selectItem itemLabel="Male" itemValue="male"/>
<f:selectItem itemLabel="Female" itemValue="female"/>
</h:selectOneMenu>
<h:message for="sex" styleClass="errorMessage"/>
<h:outputText value="#{bundle['survey.user.monthyIncome']}"></h:outputText>
<h:inputText id="monthlyIncome"
value="#{flash.monthlyIncome}"
required="true">
<f:convertNumber />
</h:inputText>
<h:message for="monthlyIncome" styleClass="errorMessage"/>
<h:outputText value="#{bundle['survey.user.yearlyTravelAbroad']}"></h:outputText>
<h:inputText id="yearlyTravelsAbroad"
value="#{flash.travelsAbroad}"
required="true">
<f:convertNumber />
</h:inputText>
<h:message for="yearlyTravelsAbroad" styleClass="errorMessage"/>
<h:outputText value="#{bundle['survey.user.oftenTravelBy']}"></h:outputText>
<h:selectOneMenu id="travelBy"
value="#{flash.travelBy}">
<f:selectItem itemLabel="#{bundle['survey.travelby.plane']}" itemValue="plane"/>
<f:selectItem itemLabel="#{bundle['survey.travelby.car']}" itemValue="car"/>
</h:selectOneMenu>
<h:message for="travelBy" styleClass="errorMessage"/>
</h:panelGrid>
<h:commandButton value="#{bundle['survey.actions.next']}"
action="confirm?faces-redirect=true"/>
<br/><br/>
</h:form>
</ui:define>
</ui:composition>
</html>
In the input.xhtml page, the user is asked to enter name, age, sex, monthly income, yearly travels abroad, and
how often the user travels by. The most important thing to notice in this page is the bolded lines, where the #{flash}
EL is used for making the value binding between the EditableValueHolder s and the flash scope. When the form data
is valid and the user clicks the "Next" commandButton , the binding is done between the EditableValueHolder values
and the flash attributes, and the page is redirected to the confirm.xhtml page. Listing 2-25 shows the initial code of
the confirm.xhtml page.