<h:messages>或<h:message>標籤的介紹,在
錯誤訊息處理 中已經有介紹了。
<h:graphicImage>
這個標籤會繪製一個HTML <img>標籤,value可以指定路徑或圖片URL,路徑可以指定相對路徑或絕對路徑,例如:
<h:graphicImage value="/images/logowiki.jpg"/>
<h:panelGrid>
這個標籤可以用來作簡單的元件排版,它會使用HTML表格標籤來繪製表格,並將元件置於其中,主要指定columns屬性,例如設定為 2:
<h:panelGrid columns="2">
<h:outputText value="Username"/>
<h:inputText id="name" value="#{userBean.name}"/>
<h:outputText value="Password"/>
<h:inputText id="password" value="#{userBean.password}"/>
<h:commandButton value="submit" action="login"/>
<h:commandButton value="reset" type="reset"/>
</h:panelGrid>
則自動將元件分作 2 個 column來排列,排列出來的樣子如下:
<h:panelGrid>的本體間只能包括JSF元件,如果想要放入非JSF元件,例如簡單的樣版(template)文字,則要使用
<f:verbatim>包括住,例如:
<h:panelGrid columns="2">
<f:verbatim>Username</f:verbatim>
<h:inputText id="name" value="#{userBean.name}"/>
<f:verbatim>Password</f:verbatim>
<h:inputText id="password" value="#{userBean.password}"/>
<h:commandButton value="submit" action="login"/>
<h:commandButton value="reset" type="reset"/>
</h:panelGrid>
<h:panelGroup>
這個元件用來將數個JSF元件包裝起來,使其看來像是一個元件,例如:
<h:panelGrid columns="2">
<h:outputText value="Username"/>
<h:inputText id="name" value="#{userBean.name}"/>
<h:outputText value="Password"/>
<h:inputText id="password" value="#{userBean.password}"/>
<h:panelGroup>
<h:commandButton value="submit" action="login"/>
<h:commandButton value="reset" type="reset"/>
</h:panelGroup>
</h:panelGrid>
在<h:panelGroup>中包括了兩個<h:commandButton>,這使得<
h:panelGrid>在處理時,將那兩個<h:commandButton>看作是一個元件來看待,其完成的版面配置如下所示: