5.2.7. JSF2 portlet example

In this example, you write a JSF2 portlet using JBoss Portlet Bridge (JPB).

The code sample originates in JPB project, and is modified in this example so that you can build it independently.

  1. Create a new Maven project as follows:

  2. Edit pom.xml:

    
    <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">
      <modelVersion>4.0.0</modelVersion>
      <groupId>org.jboss.portletbridge.examples</groupId>
      <artifactId>jsf2portlet-example</artifactId>
      <packaging>war</packaging>
      <name>JSF 2 Portlet Example</name>
      <version>1.0</version>

      <dependencies>
        <dependency>
          <groupId>com.sun.faces</groupId>
          <artifactId>jsf-api</artifactId>
          <version>2.1.14</version>
        </dependency>
        <dependency>
          <groupId>com.sun.faces</groupId>
          <artifactId>jsf-impl</artifactId>
          <scope>runtime</scope>
          <version>2.1.14</version>
        </dependency>
        <dependency>
          <groupId>org.jboss.portletbridge</groupId>
          <artifactId>portletbridge-api</artifactId>
          <version>3.1.2.Final</version>
        </dependency>
        <dependency>
          <groupId>org.jboss.portletbridge</groupId>
          <artifactId>portletbridge-impl</artifactId>
          <version>3.1.2.Final</version>
          <scope>runtime</scope>
        </dependency>
      </dependencies>

      <build>
        <finalName>jsf2portlet-example</finalName>
      </build>
    </project>

    Pay attention to the runtime scope. This tells Maven to include the dependencies to WEB-INF/lib.

    Note

    The portlet bridge libraries must be available and are usually bundled with the WEB-INF/lib directory of the web archive.

  3. Write the managed bean Echo.java:

    package com.acme.samples.jsf2portlet;
    
    
    import javax.faces.bean.ManagedBean;
    import javax.faces.bean.SessionScoped;
    import javax.faces.event.ActionEvent;
    @ManagedBean(name = "echo")
    @SessionScoped
    public class Echo {
        String str = "hello";
        public String getStr() {
            return str;
        }
        public void setStr(String str) {
            this.str = str;
        }
        public void reset(ActionEvent ae) {
            str = "";
        }
    }
  4. Edit web.xml:

    
    <?xml version="1.0"?>
    <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xmlns="http://java.sun.com/xml/ns/javaee" 
        xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
        version="2.5">

        <display-name>JSF2 Portlet Example</display-name>
        <context-param>
            <param-name>javax.portlet.faces.RENDER_POLICY</param-name>
            <param-value>ALWAYS_DELEGATE</param-value>
        </context-param>
        <context-param>
            <param-name>javax.faces.FACELETS_VIEW_MAPPINGS</param-name>
            <param-value>*.xhtml</param-value>
        </context-param>
        <context-param>
            <param-name>javax.faces.DEFAULT_SUFFIX</param-name>
            <param-value>.xhtml</param-value>
        </context-param>
        <servlet>
            <servlet-name>Faces Servlet</servlet-name>
            <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
            <load-on-startup>1</load-on-startup>
        </servlet>
        <servlet-mapping>
            <servlet-name>Faces Servlet</servlet-name>
            <url-pattern>*.faces</url-pattern>
        </servlet-mapping>
    </web-app>

    The context-params are explained at http://myfaces.apache.org/core21/myfaces-impl/webconfig.html.

  5. Edit *.xhtml files:

    • main.xhtml:

      
      <f:view id="ajaxEcho" xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets"
          xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html">
          <h:head />
          <h:body>
              <h2>JSF 2 portlet</h2>
              <p>this is simple JSF 2.0 portlet with AJAX echo.</p>
              <h:form id="form1">
              Output: <h:outputText id="out1" value="#{echo.str}" />
                  <br />
              Input: <h:inputText id="in1" autocomplete="off" value="#{echo.str}">
                      <f:ajax render="out1" />
                  </h:inputText>
                  <br />
                  <!-- A no-op button, just to lose the focus from "in1" -->
                  <h:commandButton id="button1" value="Echo" type="button" />
                  <br />
                  <!-- Resets the string, refreshes the form, but not the page -->
                  <h:commandButton id="reset" value="reset" actionListener="#{echo.reset}">
                      <f:ajax render="@form" />
                  </h:commandButton>
                  <!-- Reloads the page, doesn't reset the string -->
                  <h:commandButton id="reload" value="reload" />
                  <h:messages />
              </h:form>
          </h:body>
      </f:view>

      Here the tag f:ajax is used.

    • edit.xhtml:

      
      
      <ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:f="http://java.sun.com/jsf/core"

          xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html">

         Edit Mode
      </ui:composition>
    • help.xhtml:

      
      
      <ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:f="http://java.sun.com/jsf/core"
          xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html">

         Help Mode
      </ui:composition>
  6. Edit portlet.xml:

    
    <?xml version="1.0" encoding="UTF-8"?>
    <portlet-app xmlns="http://java.sun.com/xml/ns/portlet/portlet-app_2_0.xsd" version="2.0"
        xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xsi:schemaLocation="http://java.sun.com/xml/ns/portlet/portlet-app_2_0.xsd
       http://java.sun.com/xml/ns/portlet/portlet-app_2_0.xsd">
        <portlet>
            <portlet-name>jsf2portlet</portlet-name>
            <portlet-class>javax.portlet.faces.GenericFacesPortlet</portlet-class>
            <init-param>
                <name>javax.portlet.faces.defaultViewId.view</name>
                <value>/pages/main.xhtml</value>
            </init-param>
            <init-param>
                <name>javax.portlet.faces.defaultViewId.edit</name>
                <value>/pages/edit.xhtml</value>
            </init-param>
            <init-param>
                <name>javax.portlet.faces.defaultViewId.help</name>
                <value>/pages/help.xhtml</value>
            </init-param>
            <init-param>
                <name>javax.portlet.faces.preserveActionParams</name>
                <value>true</value>
            </init-param>
            <expiration-cache>0</expiration-cache>
            <supports>
                <mime-type>text/html</mime-type>
                <portlet-mode>VIEW</portlet-mode>
                <portlet-mode>EDIT</portlet-mode>
                <portlet-mode>HELP</portlet-mode>
            </supports>
            <portlet-info>
                <title>JSF 2.0 AJAX Portlet</title>
            </portlet-info>
        </portlet>
    </portlet-app>

    This last step makes the JSF2 application a portlet.

Deploy the portlet, add it to a page as instructed in previous sections, and test it:

Some references:

Copyright ©. All rights reserved. eXo Platform SAS
blog comments powered byDisqus