title: Using Spring / DWR Reverse Ajax functionality to display dynamic changes to table data
body: <p>In my current Spring/JSF project I need integrate a method to push server side updates (Preferably as they happen) to the web based GUI to be displayed to the clients.</p>
  
  <p>So to get started with things, I am working on this small application to get a feel of how DWR works. Basically, I've developed two variations to implement the server side push.</p>
  
  <p>In the first approach, when the "find button" is pressed the back end updates are properly displayed. This makes a calls the findInstrumentSymbols() method in the InstrumentManager and returns the output as a List Objects through DWR.</p>
  
  <p>In the second approach I attempted to implement the reverse ajax approach suggested in the DWR webs site.(<a href="http://directwebremoting.org/dwr-demo/reverseajax/peopleTable.html" rel="nofollow noreferrer">http://directwebremoting.org/dwr-demo/reverseajax/peopleTable.html</a>)</p>
  
  <p>How can make this functionality available as the default functionality every time a page loads without having to specifically activate it through a button?</p>
  
  <p>In this implementation I was unable to return the output as a List Objects through DWR as in the first approach and had to be sent as a string array. I see that the new results are not populated properly as in the first approach and it tends to looses the new data when the "Disable button" is pressed. How can this required reverse server push functionality be properly achieved using DWR?</p>
  
  <p>I have listed the code fragments below.I Would really appreciate any pointers on getting the reverse Ajax functionality to operational.</p>
  
  <p>I have used polling as as described in earlier DWR releases.What method would be most ideal to implement reverse Ajax functionality if switching to DWR3 is the way forward?</p>
  
  <p><strong>Web.xml</strong></p>
  
  <pre><code>&lt;?xml version="1.0" encoding="UTF-8"?&gt;
  &lt;web-app id="WebApp_ID" version="2.5"
      xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"&gt;
  
      &lt;display-name&gt;AdminConsole&lt;/display-name&gt;
      &lt;context-param&gt;
          &lt;param-name&gt;contextConfigLocation&lt;/param-name&gt;
          &lt;param-value&gt;/WEB-INF/application-context.xml
          /WEB-INF/application-security-context.xml&lt;/param-value&gt;
      &lt;/context-param&gt;
      &lt;context-param&gt;
          &lt;param-name&gt;javax.faces.DEFAULT_SUFFIX&lt;/param-name&gt;
          &lt;param-value&gt;.xhtml&lt;/param-value&gt;
      &lt;/context-param&gt;
      &lt;context-param&gt;
          &lt;description&gt;State saving method: 'client' or 'server' (=default). See JSF Specification 2.5.2&lt;/description&gt;
          &lt;param-name&gt;javax.faces.STATE_SAVING_METHOD&lt;/param-name&gt;
          &lt;param-value&gt;server&lt;/param-value&gt;
      &lt;/context-param&gt;
      &lt;context-param&gt;
          &lt;param-name&gt;javax.servlet.jsp.jstl.fmt.localizationContext&lt;/param-name&gt;
          &lt;param-value&gt;resources.application&lt;/param-value&gt;
      &lt;/context-param&gt;
      &lt;filter&gt;
          &lt;filter-name&gt;springSecurityFilterChain&lt;/filter-name&gt;
          &lt;filter-class&gt;org.springframework.web.filter.DelegatingFilterProxy&lt;/filter-class&gt;
      &lt;/filter&gt;
      &lt;filter-mapping&gt;
          &lt;filter-name&gt;springSecurityFilterChain&lt;/filter-name&gt;
          &lt;url-pattern&gt;/*&lt;/url-pattern&gt;
          &lt;dispatcher&gt;FORWARD&lt;/dispatcher&gt;
          &lt;dispatcher&gt;REQUEST&lt;/dispatcher&gt;
      &lt;/filter-mapping&gt;
      &lt;listener&gt;
          &lt;listener-class&gt;org.springframework.web.util.Log4jConfigListener&lt;/listener-class&gt;
      &lt;/listener&gt;
      &lt;listener&gt;
          &lt;listener-class&gt;org.springframework.security.web.session.HttpSessionEventPublisher&lt;/listener-class&gt;
      &lt;/listener&gt;
      &lt;listener&gt;
          &lt;listener-class&gt;com.sun.faces.config.ConfigureListener&lt;/listener-class&gt;
      &lt;/listener&gt;
      &lt;listener&gt;
          &lt;listener-class&gt;org.springframework.web.context.ContextLoaderListener&lt;/listener-class&gt;
      &lt;/listener&gt;
      &lt;listener&gt;
          &lt;listener-class&gt;org.springframework.web.context.request.RequestContextListener&lt;/listener-class&gt;
      &lt;/listener&gt;
      &lt;servlet&gt;
          &lt;servlet-name&gt;Faces Servlet&lt;/servlet-name&gt;
          &lt;servlet-class&gt;javax.faces.webapp.FacesServlet&lt;/servlet-class&gt;
          &lt;load-on-startup&gt;1&lt;/load-on-startup&gt;
      &lt;/servlet&gt;
      &lt;servlet-mapping&gt;
          &lt;servlet-name&gt;Faces Servlet&lt;/servlet-name&gt;
          &lt;url-pattern&gt;/faces/*&lt;/url-pattern&gt;
      &lt;/servlet-mapping&gt;
      &lt;servlet&gt;
          &lt;display-name&gt;DWR Servlet&lt;/display-name&gt;
          &lt;servlet-name&gt;dwr-invoker&lt;/servlet-name&gt;
          &lt;servlet-class&gt;org.directwebremoting.servlet.DwrServlet&lt;/servlet-class&gt;
          &lt;init-param&gt;
              &lt;param-name&gt;debug&lt;/param-name&gt;
              &lt;param-value&gt;true&lt;/param-value&gt;
          &lt;/init-param&gt;
          &lt;init-param&gt;
              &lt;param-name&gt;activeReverseAjaxEnabled&lt;/param-name&gt;
              &lt;param-value&gt;true&lt;/param-value&gt;
          &lt;/init-param&gt;
          &lt;init-param&gt;
              &lt;param-name&gt;org.directwebremoting.extend.ServerLoadMonitor&lt;/param-name&gt;
              &lt;param-value&gt;org.directwebremoting.impl.PollingServerLoadMonitor&lt;/param-value&gt;
          &lt;/init-param&gt;
          &lt;init-param&gt;
              &lt;param-name&gt;timeToNextPoll&lt;/param-name&gt;
              &lt;param-value&gt;5000&lt;/param-value&gt;
          &lt;/init-param&gt;
          &lt;load-on-startup&gt;1&lt;/load-on-startup&gt;
      &lt;/servlet&gt;
      &lt;servlet-mapping&gt;
          &lt;servlet-name&gt;dwr-invoker&lt;/servlet-name&gt;
          &lt;url-pattern&gt;/dwr/*&lt;/url-pattern&gt;
      &lt;/servlet-mapping&gt;
      &lt;session-config&gt;
          &lt;session-timeout&gt;30&lt;/session-timeout&gt;
      &lt;/session-config&gt;
      &lt;welcome-file-list&gt;
          &lt;welcome-file&gt;faces/index.xhtml&lt;/welcome-file&gt;
      &lt;/welcome-file-list&gt;
      &lt;error-page&gt;
          &lt;exception-type&gt;javax.faces.application.ViewExpiredException&lt;/exception-type&gt;
          &lt;location&gt;/login.xhtml&lt;/location&gt;
      &lt;/error-page&gt;
      .......
  &lt;/web-app&gt;
  </code></pre>
  
  <p><strong>DWR.XML</strong></p>
  
  <pre><code>&lt;?xml version="1.0" encoding="UTF-8"?&gt;
  &lt;DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 3.0//EN" "http://directwebremoting.org/schema/dwr30.dtd"&gt;
  
  &lt;dwr&gt;
    &lt;allow&gt;
      &lt;convert converter="bean" match="com.stocktrade.admin.entity.*"/&gt;
      &lt;create creator="spring" javascript="InstrumentManager"&gt;
        &lt;param name="beanName" value="instrumentManager"/&gt;
      &lt;/create&gt;   
    &lt;/allow&gt;
  &lt;/dwr&gt;
  </code></pre>
  
  <p><strong>application-context.xml</strong></p>
  
  <pre><code>&lt;?xml version="1.0" encoding="UTF-8"?&gt;
  &lt;beans xmlns="http://www.springframework.org/schema/beans"
      xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:context="http://www.springframework.org/schema/context"
      xmlns:aop="http://www.springframework.org/schema/aop" xmlns:tx="http://www.springframework.org/schema/tx"
      xmlns:jee="http://www.springframework.org/schema/jee" xmlns:p="http://www.springframework.org/schema/p"
      xmlns:dwr="http://www.directwebremoting.org/schema/spring-dwr"
      xsi:schemaLocation="http://www.springframework.org/schema/beans
         http://www.springframework.org/schema/beans/spring-beans.xsd
         http://www.springframework.org/schema/context
         http://www.springframework.org/schema/context/spring- context.xsd                       
         http://www.springframework.org/schema/tx
         http://www.springframework.org/schema/tx/spring-tx-3.0.xsd
         http://www.springframework.org/schema/jee
         http://www.springframework.org/schema/jee/spring-jee.xsd
         http://www.springframework.org/schema/aop 
         http://www.springframework.org/schema/aop/spring-aop-3.0.xsd
         http://www.directwebremoting.org/schema/spring-dwr
         http://www.directwebremoting.org/schema/spring-dwr-3.0.xsd"&gt;
  
         .....
  
      &lt;!-- bean for Instrument class --&gt;
      &lt;bean id="instrumentManager"  class="com.stocktrade.admin.instrument.InstrumentManagerImpl"&gt;
          &lt;property name="instrumentDAO" ref="instrumentDAO"&gt;&lt;/property&gt;
          &lt;property name="userManager" ref="userManager"&gt;&lt;/property&gt;
          &lt;property name="accountManager" ref="accountManager"&gt;&lt;/property&gt;
          &lt;property name="portfolioManager" ref="portfolioManager"&gt;&lt;/property&gt;
      &lt;/bean&gt;
  
        ......
  &lt;/beans&gt;
  </code></pre>
  
  <p><strong>Instrument Class</strong></p>
  
  <pre><code>package com.xxxxx.admin.entity;
  
  import java.io.Serializable;
  import java.math.BigDecimal;
  import java.util.List;
  
  import javax.persistence.Column;
  import javax.persistence.Entity;
  import javax.persistence.Id;
  import javax.persistence.OneToMany;
  import javax.persistence.Table;
  
  @Entity
  @Table(name = "instrument")
  public class Instrument implements Serializable {
  
      private static final long serialVersionUID = 1L;
  
      @Id
      @Column(name="symbolName")
      private String SymbolName;
  
      @Column(name="name")
      private String Name;
  
      @Column(name="quantity")
      private long Quantity;
  
      @Column(name="price")
      private BigDecimal Price;
  
      @Column(name="Limit")
      private int Limit;
  
      public String getSymbolName() {
          return SymbolName;
      }
      public void setSymbolName(String symbolName) {
          SymbolName = symbolName;
      }
      public String getName() {
          return Name;
      }
      public void setName(String name) {
          Name = name;
      }
      public long getQuantity() {
          return Quantity;
      }
      public void setQuantity(long quantity) {
          Quantity = quantity;
      }
      public BigDecimal getPrice() {
          return Price;
      }
      public void setPrice(BigDecimal price) {
          Price = price;
      }
      public int getLimit() {
          return Limit;
      }
      public void setLimit(int Limit) {
          Limit = Limit;
      }
  }
  </code></pre>
  
  <p><strong>InstrumentManager Class</strong></p>
  
  <pre><code>package com.xxxxx.admin.instrument; 
  
  import java.math.BigDecimal;
  import java.util.List;
  import com. xxxxx.admin.entity.Instrument;
  import com. xxxxx.admin.entity.Portfolio;
  import com. xxxxx.admin.entity.Account;
  import com. xxxxx.admin.entity.Users;
  
  public interface InstrumentManager {    
          ………
          /*used to implement the find() functionality*/
      public List&lt;Instrument&gt; findInstrumentSymbols();
          /*used to implement the reverse ajax functionality*/
      public void SendInstrumentSymbols();
      public void addAttributeToScriptSession();
      public void removeAttributeToScriptSession();
      public void run();
  }
  </code></pre>
  
  <p><strong>InstrumentManagerImpl Class</strong> </p>
  
  <pre><code>package com.xxxxx.admin.instrument;
  
  import java.math.BigDecimal;
  import java.util.List;
  import java.util.ArrayList;
  import java.util.Collection;
  
  import com.xxxxx.admin.account.AccountManager;
  import com.xxxxx.admin.dao.InstrumentDAO;
  import com.xxxxx.admin.entity.Instrument;
  import com.xxxxx.admin.entity.Account;
  import com.xxxxx.admin.entity.Portfolio;
  import com.xxxxx.admin.entity.Users;
  import com.xxxxx.admin.portfolio.PortfolioManager;
  import com.xxxxx.admin.user.UserManager;
  
  import org.directwebremoting.WebContext;
  import org.directwebremoting.WebContextFactory;
  import org.directwebremoting.util.Logger;
  import org.directwebremoting.ScriptSession;
  import org.directwebremoting.ScriptSessionFilter;
  import org.directwebremoting.Browser;
  import org.directwebremoting.ServerContextFactory;
  import org.directwebremoting.impl.DaemonThreadFactory;
  import org.directwebremoting.ui.dwr.Util;
  
  import java.util.concurrent.ScheduledThreadPoolExecutor;
  import java.util.concurrent.TimeUnit;
  
  public class InstrumentManagerImpl implements InstrumentManager,Runnable {
  
      private final static String SCRIPT_SESSION_ATTR = "SCRIPT_SESSION_ATTR";
      public static String getScriptSessionAttr() {
          return SCRIPT_SESSION_ATTR;
      }
  
      private UserManager userManager;
      public UserManager getUserManager() {
          return userManager;
      }
      public void setUserManager(UserManager userManager) {
          this.userManager = userManager;
      }
  
      private InstrumentDAO instrumentDAO;
      public InstrumentDAO getInstrumentDAO() {
          return instrumentDAO;
      }
      public void setInstrumentDAO(InstrumentDAO instrumentDAO) {
          this.instrumentDAO = instrumentDAO;
      }
  
      public InstrumentManagerImpl() {
          ScheduledThreadPoolExecutor executor = new ScheduledThreadPoolExecutor(1, new DaemonThreadFactory());
          executor.scheduleAtFixedRate(this, 1, 10, TimeUnit.SECONDS);
      }
  
      /* (non-Javadoc)
       * @see java.lang.Runnable#run()
       */
      @Override
      public void run()
      {
          SendInstrumentSymbols();
      }
          /*used to implement the find() functionality*/
      @Override
      public List&lt;Instrument&gt; findInstrumentSymbols() {
          return instrumentDAO.findInstrumentSymbols();
      }
      /*used to implement the reverse ajax functionality*/
      public void SendInstrumentSymbols() {
          // Get the current page.
          String page = ServerContextFactory.get().getContextPath() + "/faces/gehan.xhtml";
          // Create a new AttributeScriptSessionFilter which will look for an attribute on the ScriptSession
          ScriptSessionFilter attributeFilter = new AttributeScriptSessionFilter(SCRIPT_SESSION_ATTR);
          // Update the page, filters ScriptSessions using attributeFilter.  If the SCRIPT_SESSION_ATTR
          // has not been set on the ScriptSession the page in question will not receive updates.
          Browser.withPageFiltered(page, attributeFilter, new Runnable()
          {
              @Override
              public void run()
              {
                  List&lt;Instrument&gt; InstrumentList = new ArrayList&lt;Instrument&gt;();
                  InstrumentList = findInstrumentSymbols() ;
              //Creates a multi-dimensional array, containing a row and the rows column data.
              //Added the First Element of the List returned - values are converted to String
                  String[][] data = {
                      {InstrumentList.get(0).getSymbolName().toString(), InstrumentList.get(0).getName().toString(), String.valueOf(InstrumentList.get(0).getQuantity()), InstrumentList.get(0).getPrice().toString(), String.valueOf(InstrumentList.get(0).getMarketMakingLimit())}};
  
     // Call DWR's util which adds rows into a table.peopleTable is the id of the tbody and 
        data contains the row/column data.  
                  Util.addRows("MMTable", data);
              }
          });
      }
  
      /**
       * Called from the client to add an attribute on the ScriptSession.  This
       * attribute will be used so that only pages (ScriptSessions) that have 
       * set this attribute will be updated.
       */
      public void addAttributeToScriptSession() {
          ScriptSession scriptSession = WebContextFactory.get().getScriptSession();
          scriptSession.setAttribute(SCRIPT_SESSION_ATTR, true);
      }
  
      /**
       * Called from the client to remove an attribute from the ScriptSession.  
       * When called from a client that client will no longer receive updates 
           * (unless addAttributeToScriptSession)
       * is called again.
       */
      public void removeAttributeToScriptSession() {
          ScriptSession scriptSession = WebContextFactory.get().getScriptSession();
          scriptSession.removeAttribute(SCRIPT_SESSION_ATTR);
      }
  
     /**
       * This is the ScriptSessionFilter that will be used to filter out all ScriptSessions
       * unless they contain the SCRIPT_SESSION_ATTR attribute. 
       */
      protected class AttributeScriptSessionFilter implements ScriptSessionFilter
      {
          private final String attributeName;
  
          public AttributeScriptSessionFilter(String attributeName)
          {
              this.attributeName = attributeName;
          }
  
          @Override
          public boolean match(ScriptSession session)
          {
              Object check = session.getAttribute(attributeName);
              return (check != null &amp;&amp; check.equals(Boolean.TRUE));
          }
      }
  
  }
  </code></pre>
  
  <p><strong>updateMMStatus.xhtml</strong></p>
  
  <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
  &lt;html xmlns="http://www.w3.org/1999/xhtml" 
        xmlns:ui="http://java.sun.com/jsf/facelets" 
        xmlns:h="http://java.sun.com/jsf/html" 
        xmlns:f="http://java.sun.com/jsf/core"&gt;
        &lt;h:head&gt;
        &lt;title&gt;Reverse Ajax Table Update&lt;/title&gt;
        &lt;meta http-equiv="Content-Type" content="text/html; charset=us-ascii" /&gt;
        &lt;script type='text/javascript' src='/AdminConsole/dwr/engine.js'&gt;&lt;/script&gt;
        &lt;script type='text/javascript' src='/AdminConsole/dwr/util.js'&gt;&lt;/script&gt;
        &lt;script type='text/javascript' src='/AdminConsole/dwr/interface/InstrumentManager.js'&gt;&lt;/script&gt;
  
        &lt;script type="text/javascript"&gt;
              window.onload=function()
              {
                              // Initiate reverse ajax polling
                  dwr.engine.setActiveReverseAjax(true);
                              // Called when a call and all retry attempts fail 
                  dwr.engine.setErrorHandler(errorHandler);
                              // Optional function to call when the reverse ajax status changes (e.g. online to offline) 
                  dwr.engine.setPollStatusHandler(updatePollStatus);
                              // Optional - We are online right now!  Until DWR determines we are not! 
                  updatePollStatus(true);
                              //Optional - When the page is unloaded, remove this ScriptSession. 
                  dwr.engine.setNotifyServerOnPageUnload(true);
                              // Initialize the tabs for this display         
                  Tabs.init('tabList', 'tabContents'); 
                              // Make a call to the server to begin updating the table!   
                  InstrumentManager.SendInstrumentSymbols();
                              //Make a remote call to the server to add an attribute onto the ScriptSession 
                              //which will be used in determining what pages receive updates! 
                  addAttributeToScriptSession(); 
              }
                  function errorHandler(message, ex) {
                      dwr.util.setValue("error", "Cannot connect to server. Initializing retry logic.", {escapeHtml:false});
                      setTimeout(function() { dwr.util.setValue("error", ""); }, 5000)
                  }
  
                  function updatePollStatus(pollStatus) {
                      dwr.util.setValue("pollStatus", pollStatus ? "Online" : "Offline", {escapeHtml:false});
                  }
  
                  // Make a remote call to add an attribute on the ScriptSession.
                  // Only clients that have this attribute set will receive updates.    
                  function addAttributeToScriptSession() {
                      InstrumentManager.addAttributeToScriptSession();
                  }
  
                  // Make a remote call to remove an attribute from the ScriptSession.
                  // Clients that call this will no longer receive updates (unless addAttributeToScriptSession is called again).        
                  function removeAttributeToScriptSession() {
                      InstrumentManager.removeAttributeToScriptSession();
                  }
        &lt;/script&gt;
      /*Java script to updated instrument table related changes when the "find" Button is pressed */
      function find() {
        &lt;script type="text/javascript"&gt;
        function find() {
          InstrumentManager.findInstrumentSymbols();
        }
      &lt;/script&gt;
      &lt;/h:head&gt;
      &lt;h:body onload="dwr.engine.setActiveReverseAjax(true);"&gt;
  
      &lt;input type="button" value="Enable page updates" onclick="addAttributeToScriptSession();"/&gt;
      &lt;input type="button" value="Disable page updates" onclick="removeAttributeToScriptSession();"/&gt;
  
          &lt;h:messages styleClass="error" /&gt;
          &lt;div class="data_header"&gt;Current Symbols in the System&lt;/div&gt;
          &lt;h:dataTable rowClasses="odd,even" id="MMTable"
              value="#{updateMMStausBean.instrumentsList}" var="insList"
              rendered="#{updateMMStausBean.instrumentsList != null}"
              headerClass="tableHeader" styleClass="table"&gt;
              &lt;h:column&gt;
                  &lt;f:facet name="header"&gt;
                      &lt;h:outputText value="Symbol" /&gt;
                  &lt;/f:facet&gt;
                  &lt;div align="left"&gt;
                      &lt;h:outputText value="#{insList.symbolName}" /&gt;
                  &lt;/div&gt;
              &lt;/h:column&gt;
              &lt;h:column&gt;
                  &lt;f:facet name="header"&gt;
                      &lt;h:outputText value="Name" /&gt;
                  &lt;/f:facet&gt;
                  &lt;div align="left"&gt;
                      &lt;h:outputText value="#{insList.name}" /&gt;
                  &lt;/div&gt;
              &lt;/h:column&gt;
              &lt;h:column&gt;
                  &lt;f:facet name="header"&gt;
                      &lt;h:outputText value="Quantity" /&gt;
                  &lt;/f:facet&gt;
                  &lt;div align="center"&gt;
                      &lt;h:outputText value="#{insList.quantity}" /&gt;
                  &lt;/div&gt;
              &lt;/h:column&gt;
              &lt;h:column&gt;
                  &lt;f:facet name="header"&gt;
                      &lt;h:outputText value="Price($)" /&gt;
                  &lt;/f:facet&gt;
                  &lt;div align="right"&gt;
                      &lt;h:outputText value="#{insList.price}" /&gt;
                  &lt;/div&gt;
              &lt;/h:column&gt;
              &lt;h:column&gt;
                  &lt;f:facet name="header"&gt;
                      &lt;h:outputText value="Limit" /&gt;
                  &lt;/f:facet&gt;
                  &lt;div align="right"&gt;
                      &lt;h:outputText value="#{insList.mMLimit}" /&gt;
                  &lt;/div&gt;
              &lt;/h:column&gt;
          &lt;/h:dataTable&gt;
  
          &lt;div id="container"&gt;    
      &lt;h:panelGrid columns="2" cellpadding="6"&gt;
      &lt;h:form id="authenticate1"&gt;
      &lt;h:commandButton action="#{updateMMStausBean.ActivateAllMMOrdrerOn()}" value="Activate all Orders"&gt;
      &lt;/h:commandButton&gt;
      &lt;/h:form&gt;
  
      &lt;h:form id="authenticate2"&gt;
      &lt;h:commandButton action="#{updateMMStausBean.DeactivateAllMMOrdrerOn()}" value="Deactivate all Orders"&gt;
      &lt;/h:commandButton&gt;
      &lt;/h:form&gt;
  
          /*  Java script to updated instrument table related changes when the "find" Button is pressed */
      &lt;h:form id="authenticate3"&gt;
      &lt;h:commandButton value="Find" onclick="find()"&gt;
      &lt;/h:commandButton&gt;
      &lt;/h:form&gt;  
      &lt;/h:panelGrid&gt;
  &lt;/div&gt;
  
        &lt;/h:body&gt;
  
  &lt;/html&gt;
  </code></pre>