Retrieve the fragment (hash) from a URL and inject the values into the bean Retrieve the fragment (hash) from a URL and inject the values into the bean javascript javascript

Retrieve the fragment (hash) from a URL and inject the values into the bean


You can do this with help of window.onhashchange which fills an input field of a hidden form which submits itself asynchronously when the input field has changed.

Here's a kickoff example of the Facelets page:

<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"     xmlns:f="http://java.sun.com/jsf/core"    xmlns:h="http://java.sun.com/jsf/html">    <h:head>        <title>SO question 3475076</title>        <script>            window.onload = window.onhashchange = function() {                var fragment = document.getElementById("processFragment:fragment");                fragment.value = window.location.hash;                fragment.onchange();            }        </script>        <style>.hide { display: none; }</style>    </h:head>    <h:body>        <h:form id="processFragment" class="hide">            <h:inputText id="fragment" value="#{bean.fragment}">                <f:ajax event="change" execute="@form" listener="#{bean.processFragment}" render=":showFragment" />            </h:inputText>        </h:form>        <p>Change the fragment in the URL. Either manually or by those links:            <a href="#foo">foo</a>, <a href="#bar">bar</a>, <a href="#baz">baz</a>        </p>        <p>Fragment is currently: <h:outputText id="showFragment" value="#{bean.fragment}" /></p>    </h:body></html>

Here's how the appropriate bean look like:

package com.stackoverflow.q3475076;import javax.faces.bean.ManagedBean;import javax.faces.bean.RequestScoped;import javax.faces.event.AjaxBehaviorEvent;@ManagedBean@RequestScopedpublic class Bean {    private String fragment;    public void processFragment(AjaxBehaviorEvent event) {        // Do your thing here. This example is just printing to stdout.        System.out.println("Process fragment: " + fragment);    }    public String getFragment() {        return fragment;    }    public void setFragment(String fragment) {        this.fragment = fragment;    }}

That's all.

Note that the onhashchange event is relatively new and not supported by the older browsers. In absence of the browser support (undefinied and so on), you'd like to check window.location.hash at intervals using setInterval() instead. The above code example should at least give a good kickoff. It works at at least FF3.6 and IE8.


Here's the most reliable way to extract a fragment from a syntactically valid URL / URI.

 URI uri = new URI(someString); String fragment = uri.getFragment();

How you inject this into a bean will depend on what server-side framework you are using, and whether you are doing the injection using XML or annotations, or doing it programmaticaly.


Watch this question and especially the answers: JSP Servlet anchor

  • Fragment cannot be seen onserver-side.
  • You can extract fragmenton client-side, convert it and send tothe server via Ajax.