TOTD #46: Facelets with Java Server Faces 1.2


This blog updates TOTD #45 to use Facelets as view technology.

Powerful templating system, re-use and ease-of-development, designer-friendly are the key benefits of Facelets. Facelets are already an integral part of Java Server Faces 2.0. But this blog shows how to use them with JSF 1.2.
  1. Download Facelets from here (or specifically 1.1.14). Facelets Developer Documentation is a comprehensive source of information.
  2. Add "jsf-facelets.jar" from the expanded directory to Project/Libraries as shown:

  3. Change the JSF view documents to ".xhtml" by adding the a new context parameter in "web.xml" as:

    <context-param>
        <param-name>javax.faces.DEFAULT_SUFFIX</param-name>
        <param-value>.xhtml</param-value>
      </context-param>

    The updated "web.xml" looks like:

  4. Specify Facelets as the ViewHandler of JSF application by adding the following fragment to "faces-config.xml":

      <application>
        <view-handler>com.sun.facelets.FaceletViewHandler</view-handler>   
      </application>

    The updated document looks like:


  5. Create three new XHTML pages by right-clicking on the project, selecting "New", "XHTML" and name them as "template", "welcome" and "result". This creates "template.xhtml", "welcome.xhtml" and "result.xhtml" in "Web Pages" folder. 
    1. Replace the generated code in "template.xtml" with the code given here. Change the <title> text "Facelets: What's your favorite City ?".
    2. Replace the generated code in "welcome.xhtml" with the code given here. Refactor "welcomeJSF.jsp" such that H1 tag and the associated text goes in <ui:define name="title"> and rest of the content goes in <ui:define name="body">. Also change the value of "template" attribute of <ui:composition> by removing "/". The updated page looks like:

    3. Replace the generated code in "result.xhtml" with the code given here. Refactor "result.jsp" such that H1 tag and the associated text goes in <ui:define name="title"> and rest of the content goes in <ui:define name="body">. Also add a namespace declaration for "http://java.sun.com/jsf/core".

      Optionally change the <h:form> associated with the command button to:

                      <form jsfc="h:form">
                          <input jsfc="h:commandButton" action="back" value="Back"/>
                      </form> 

      The updated page looks like:


  6. Add couple of more navigation rules to "faces-config.xml":

        <navigation-rule>
            <from-view-id>/welcome.xhtml</from-view-id>
            <navigation-case>
                <from-outcome>submit</from-outcome>
                <to-view-id>/result.xhtml</to-view-id>
            </navigation-case>
        </navigation-rule>
        <navigation-rule>
            <from-view-id>/result.xhtml</from-view-id>
            <navigation-case>
                <from-outcome>back</from-outcome>
                <to-view-id>/welcome.xhtml</to-view-id>
            </navigation-case>
        </navigation-rule>
And that's it, Facelets-based application is now available at "http://localhost:8080/Cities/faces/welcome.xhtml". The interaction is exactly similar to as shown in TOTD #45 and some of the sample images (borrowed from TOTD #45) are:


Now this application is using Facelets as the view technology instead of the in-built view definition framework.
Please leave suggestions on other TOTD (Tip Of The Day) that you'd like to see. A complete archive of all tips is available here.

Technorati: totd javaserverfaces facelets netbeans glassfish
Comments:

看不懂,留言一下

Posted by 一卡多号 on September 23, 2008 at 04:54 AM PDT #

[Trackback] Java Server Faces 2.0 specification (JSR 314, EDR2) and implementation (soon to be EDR2) are brewing. This blog shows how to get started with Mojarra - Sun's implementation of JSF. GlassFish v2 comes bundled with Mojarra 1.2_04 which allows...

Posted by Arun Gupta's Blog on October 13, 2008 at 10:55 PM PDT #

Post a Comment:
Comments are closed for this entry.
About

profile image
Arun Gupta is a technology enthusiast, a passionate runner, author, and a community guy who works for Oracle Corp.


Java EE 7 Samples

Stay Connected

Search

Archives
« April 2014
SunMonTueWedThuFriSat
  
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
   
       
Today