background image

The checkoutForm Page

<< Coffee Break Server | JavaBeans Components >>
<< Coffee Break Server | JavaBeans Components >>

The checkoutForm Page

<h:dataTable id=
"table"
columnClasses=
"list-column-center,list-column-right,
list-column-center, list-column-right
"
headerClass=
"list-header" rowClasses="list-row"
footerClass=
"list-column-right"
styleClass=
"list-background-grid"
value=
"#{CoffeeBreakBean.cart.items}" var="sci">
<f:facet name=
"header">
<h:outputText
value=
"#{CBMessages.OrderForm}"/>
</f:facet>
<h:column>
<f:facet name=
"header">
<h:outputText
value=
"Coffee"/>
</f:facet>
<h:outputText id=
"coffeeName"
value=
"#{sci.item.coffeeName}"/>
</h:column>
...
</h:dataTable>
When this tag is processed, a UIData component and a Table renderer are created on the server
side. The UIData component supports a data binding to a collection of data objects. The Table
renderer takes care of generating the HTML markup. The UIData component iterates through
the list of coffees, and the Table renderer renders each row in the table.
This example is a classic use case for a UIData component because the number of coffees might
not be known to the application developer or the page author at the time the application is
developed. Also, the UIData component can dynamically adjust the number of rows in the table
to accommodate the underlying data.
For more information on UIData, please see
"Using Data-Bound Table Components" on
page 337
.
The checkoutForm Page
checkoutForm
is used to collect delivery and billing information from the customer. When the
Submit button is clicked, an ActionEvent is generated. This event is first handled by the submit
method of the checkoutFormBean. This method acts as a listener for the event because the tag
corresponding to the submit button references the submit method with its action attribute:
<h:commandButton value=
"#{CBMessages.Submit}"
action=
"#{checkoutFormBean.submit}"/>
The submit method submits the suborders to each supplier and stores the result in the
request-scoped OrderConfirmations bean.
The checkoutForm page has standard validators on several components and a custom validator
on the email component. Here is the tag corresponding to the firstName component, which
holds the customer's first name:
Coffee Break Server
Chapter 36 · The Coffee Break Application
1047