2 Replies Latest reply on Nov 20, 2007 4:41 AM by Alejandro Montenegro

    auto refresh a portlet

    cpage cpage Novice

      hi,

      i want to know how i could make a single portlet auto-refresh.

      i tried the ajax4jsf framework but my ajax4jsf portlet does'nt work into jboss portal.
      it works alone when i call it outside the portal.

      first, i had to inject the header generated by the portlet, into my main portal page, but anyway, ajax doesn't work because the entire page is refresh.

      work with 2.4.0

      is the 2.6 can help me ?

      thx a lot

        • 1. Portlet auto refresh?
          Elixir Blume Newbie

          Has anyone found an easy way to auto refresh a portlet every so many seconds/minutes without a full page refresh? (Either through JavaScript code in the portlet or through some sort of JBoss portlet configuration option.)

          On the Dashboards tab as the admin user, selecting the "Partial refresh - Enable partial refresh for portlets" option allows for portlet updates upon user actions without redisplaying the entire page. (This seems to work ok, now I'm just trying to figure out how to auto redisplay the portlet data every so many seconds without a full page refresh.)

          Thanks,

          • 2. Re: auto refresh a portlet
            Alejandro Montenegro Novice

            HI, I made it work based on some info found at http://www.javapassion.com and the AjaxPortlet at http://labs.jboss.com/portletswap. What I had to do was to create a Portlet and a Servlet that generate the same response. Initially it is my portlet that generate the response, then with ajax I request for the Servlet to make the refresh automagically.
            Sang Shin gets in deeper details at http://www.javapassion.com/ajaxcodecamp/#PortletsPortals_and_Ajax. I used the AjaxPortlet to figure out the URL of the Servlet.

            This is the JSP that the portlet calls, and then the magic begins:

            <%@page contentType="text/html"%>
            <%@page pageEncoding="UTF-8"%>
            
            <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
            
            <%-- Uncomment below lines to add portlet taglibs to jsp
            <%@ page import="javax.portlet.*"%>
            <%@ taglib uri="http://java.sun.com/portlet" prefix="portlet"%>
            
            <portlet:defineObjects />
            <%PortletPreferences prefs = renderRequest.getPreferences();%>
            --%>
            
            <script type="text/javascript">
             var req;
             var target;
             var isIE;
            
             // (3) JavaScript function in which XMLHttpRequest JavaScript object is created.
             // Please note that depending on a browser type, you create
             // XMLHttpRequest JavaScript object differently. Also the "url" parameter is not
             // used in this code (just in case you are wondering why it is
             // passed as a parameter).
             //
            
            
             function initRequest(url) {
             //console.log("initRequest(%s) is called", url);
             //alert("initRequest(" + url + ") is called");
             if (window.XMLHttpRequest) {
             req = new XMLHttpRequest();
             } else if (window.ActiveXObject) {
             isIE = true;
             req = new ActiveXObject("Microsoft.XMLHTTP");
             }
             }
            
             // (2) Event handler that gets invoked whenever a user types a character
             // in the input form field whose id is set as "userid". This event
             // handler invokes "initRequest(url)" function above to create XMLHttpRequest
             // JavaScript object.
             //
            
            
             function getNumbers() {
             var url = "/MostTransactionsPortlet/MostTransactionServlet";
             // Invoke initRequest(url) to create XMLHttpRequest object
             initRequest(url);
            
             // The "processRequest" function is set as a callback function.
             // (Please note that, in JavaScript, functions are first-class objects: they
             // can be passed around as objects. This is different from the way
             // methods are treated in Java programming language.)
             req.onreadystatechange = processRequest;
             req.open("GET", url, true);
             req.send(null);
             }
            
             // (4) Callback function that gets invoked asynchronously by the browser
             // when the data has been successfully returned from the server.
             // (Actually this callback function gets called every time the value
             // of "readyState" field of the XMLHttpRequest object gets changed.)
             // This callback function needs to be set to the "onreadystatechange"
             // field of the XMLHttpRequest.
             //
            
            
             function processRequest() {
             if (req.readyState == 4) {
             if (req.status == 200) {
             var message = req.responseText;
             mdiv = document.getElementById("mostTransacted");
             mdiv.innerHTML = message;
             }
             }
             }
            
             function doCounter(){
             setInterval("getNumbers()", 5000);
             }
            </script>
            <script>
             window.onload=doCounter;
            </script>
            
            <div id="mostTransacted">
             <table width="100%" border="0" cellspacing="1" cellpadding="2">
             <tr bgcolor="#6699CC">
             <font color="#FFFFFF">
             <td align="center"><font color="#FFFFFF">INSTRUMENTO</font></td>
             <td align="center"><font color="#FFFFFF">NEGOCIO</font></td>
             <td align="center"><font color="#FFFFFF">MONTO($)</font></td>
             <td align="center"><font color="#FFFFFF">VAR(%)</font></td>
             </font>
             </tr>
             <c:forEach items="${transactions}" var="transaction" varStatus="rowCounter">
             <c:choose>
             <c:when test="${rowCounter.count % 2 == 0}">
             <tr bgcolor="#6699CC">
             <td><font color="#FFFFFF">${transaction.instrument}</font></td>
             <td align="right"><font color="#FFFFFF">${transaction.business}</font></td>
             <td align="right"><font color="#FFFFFF">${transaction.amount}</font></td>
             <td align="right"><font color="#33FF33">${transaction.variable}</font></td>
             </tr>
             </c:when>
             <c:otherwise>
             <tr bgcolor="#92B6DA">
             <td><font color="#FFFFFF">${transaction.instrument}</font></td>
             <td align="right"><font color="#FFFFFF">${transaction.business}</font></td>
             <td align="right"><font color="#FFFFFF">${transaction.amount}</font></td>
             <td align="right"><font color="#33FF33">${transaction.variable}</font></td>
             </tr>
             </c:otherwise>
             </c:choose>
             </c:forEach>
             </table>
            </div>


            Regards
            Alejandro