Java Reference
In-Depth Information
<h:messages styleClass="messages"
style="list-style: none; padding:0; margin:0;"
errorClass="alert alert-error" infoClass="alert
alert-success"
warnClass="alert alert-warning"
globalOnly="true" />
</h:form>
</div>
</div>
</div>
// some code
</div>
</ui:define>
</ui:composition>
As you can see, the preceding view contains a form to enter a new seat type in the topmost
section. The highlighted input text will actually pass data to the
SeatType
object, which
will be transferred to the
TheatreSetupService
CDI Bean and ultimately persisted
when the user clicks on the
Add
button.
You may also notice many
class
attributes on the tags. These attributes refer to the CSS
classes defined by Bootstrap; we use them to visualize our validation. If a user places
some invalid data in a form input, a proper CSS class is assigned to it (Bootstrap's
has-
error
method in our case). This is, however, a strictly frontend-related addition. The
JSF validation message will be shown with or without it thanks to the
h:messages
tag
and the Bean Validation constraints defined in the earlier part of this chapter.
An interesting addition is the fact that we use one of the JSF 2.2 features, which eases in-
tegration with HTML5 frontend frameworks, the
pass-through
attributes. By using
the
xmlns:p=http://xmlns.jcp.org/jsf/passthrough
namespacein
p:placeholder
, we instruct JSF to ignore an unknown attribute and pass it straight to
the renderer. Then, Bootstrap's internal mechanisms can interpret the attribute, and
provide our input controls with placeholder text, which disappears after a control gains fo-
cus.
The next part of the
setup.xhtml
file is available in the following code:
<div class="col-md-6">
<div class="panel panel-default">
