Adding an Image
Adding an Image
Can you guess it?</h2>
</h:form>
</f:view>
Adding an Image
To display images on a page, you use the graphicImage tag. The url attribute of the tag specifies
the path to the image file. Let's add Duke to the page using a graphicImage tag:
<%@ taglib uri=
"http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri=
"http://java.sun.com/jsf/core" prefix="f" %>
<f:view>
<h:form id=
"helloForm1">
<h2>Hi. My name is Duke. I
'm thinking of a number from
<h:outputText lang=
"en_US"
value=
"#{UserNumberBean.minimum}"/> to
<h:outputText value=
"#{UserNumberBean.maximum}"/>.
Can you guess it?</h2>
<h:graphicImage id=
"waveImg" url="/wave.med.gif" />
</h:form>
</f:view>
Adding a Text Field
The inputText tag represents a text field component. In the guessNumber example, this text
field takes an integer input value. The instance of this tag included in greeting.jsp has three
attributes: id, label, and value.
<h:inputText id=
"userNo" label="User Number"
value=
"#{UserNumberBean.userNumber}">
...
</h:inputText>
The id attribute corresponds to the ID of the component object represented by this tag. In this
case, an id attribute is required because the message tag (which is used to display validation
error messages) needs it to refer to the userNo component.
The label attribute specifies the name to be used by error messages to refer to the component.
In this example, label is set to User Number. As an example, if a user were to enter 23, the error
message that would be displayed is:
User Number: Validation Error: Value is greater than allowable maximum of 10.
The value attribute binds the userNo component value to the bean property
UserNumberBean.userNumber
, which holds the data entered into the text field.
After adding the inputText tag, the greeting page looks like the following:
A Simple JavaServer Faces Application
The Java EE 5 Tutorial · September 2007
292
