1 Reply Latest reply on Aug 19, 2010 2:58 AM by Charles Akalugwu

    Anchor-based AJAX navigation in Seam

    Luis Tama Newbie

      Hello Seam forum!

      Right to the point. Is there a recommended way to get anchor-based AJAX navigation in Seam?

      I would like this because I want to minimize the time spent loading menus, toolbars, etc., so the user has to wait only for requested content. The goal is to get partial updates in my app, but providing the client browser with anchor-based URLs (not for every update but for main sections of the app), so the user can bookmark and also navigate back and forward. It's just the way Gmail handles AJAX requests and partial content loading/(re)rendering when displaying messages, search results, options, etc.

      There is something related in this forum, where the author talks about the one page does everything development style of AJAX, but in two years nobody seems to have a satisfiying answer on the topic using Seam:

      Another post talks about page actions on partial rendering, and there is a solved issue, but strictly related to disabling page actions on postback.

      Here is a solution using PHP and Javascript (though it seems not to support SEO), from where I got inspired:

      So I want to implement the proposed behaviour in my Seam-based app (the same or some other way), but I would like to know if jPDL pageflows and/or pages.xml navigation rules and conversations will support anchor based view ids, or if they will get broken (so I won't lose my time). If it will work, please tell if there is any best practice, recommended way or advice to achieve this successfully.

      BTW, I'm using Seam 2.0.2.SP1, so please tell if I should migrate to 2.1.x or 2.2.x, only if one of these newer versions have the functionality or make it easier/possible to implement (if not, I'd prefer not to migrate). For AJAX I'm using Richfaces 3.3.1.GA.

      Thanks in advance!

        • 1. Re: Anchor-based AJAX navigation in Seam
          Charles Akalugwu Newbie


          I would also like to know if this is possible and how to achieve it. I have integrated XMPP IM in my seam app. Logged in users can see a bar positioned at the bottom of the browser viewport (not the bottom of the document). By positioning the div as fixed, the chat bar stays at the same position regardless of scrolling. This bar is just like that found on facebook except that its missing one thing. The bar loses its state when pages are navigated due to the reload of entire content. Using firebug, I could see that facebook links have anchors as the hrref. Furthermore, link clicking is intercepted by javascript and the target payload is fetched using XmlHttpRequest and the page is updated accordingly without a reload. I would like to know if this would be an issue in a seam app. As the previous poster said, what best practices do you recommend?

          By pondering, If I were to proceed, I might want to replace all my links which perform page reloads currently (such as links in the menu bar) such as regular a tag, h:outputLink and so on to, to a4j:commandLink and use a nested a4j:support tag to reRender content with an id such as body once the event, oncomplete is fired. I would want to use facelets to enable me logically divide my page into header, menu, body, footer and perhaps, chatbar. Therefore its the body part of the facelets which gets reRendered on those link navigations. Therefore this might keep the chatbar from reloading all the time? Does the line of thought above make any sense?

          I am using seam 2.2.0 GA, Richfaces 3.3.3GA, JBoss AS 5.1 GA.

          Thanks in advance.