4

I am trying to get started with JSF 2.0. I am trying a basic navigation example and it's not working properly.

The file structure is the following:

enter image description here

I have configured the mapping in web.xml:

<!-- Change to "Production" when you are ready to deploy -->
<context-param>
    <param-name>javax.faces.PROJECT_STAGE</param-name>
    <param-value>Development</param-value>
</context-param>

<!-- Welcome page -->
<welcome-file-list>
    <welcome-file>index.xhtml</welcome-file>
</welcome-file-list>

<!-- JSF mapping -->
<servlet>
    <servlet-name>Faces Servlet</servlet-name>
    <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
</servlet>

<servlet-mapping>
    <servlet-name>Faces Servlet</servlet-name>
    <url-pattern>*.xhtml</url-pattern>
</servlet-mapping>

And the index page has 2 buttons which take you to different pages when clicked

The faces-config.xml file defines some navigation cases:

<!-- Configuration of navigation rules -->  
<navigation-rule>
    <from-view-id>/index.xhtml</from-view-id> 
    <navigation-case>
        <from-outcome>success</from-outcome>
        <to-view-id>/pages/success.xhtml</to-view-id>
    </navigation-case>
     <navigation-case>
        <from-outcome>error</from-outcome>
        <to-view-id>/pages/error.xhtml</to-view-id>
    </navigation-case>
</navigation-rule>

E.g. the following button should take you to the success page (/pages/success.xhtml):

<p:commandButton id="addUser" value="Add" action="#{userMB.addUser}" ajax="false"/>

I have debugged this an the return value of addUser is definitely "success".

The page switches to success.xhtml because I see the content is changed, but the browser URL points to index.xhtml....

At startup: URL is localhost:8080/PROJECT/ with no index.xhtml probably because we configured it as the welcome file. When we hit the button above, the URL becomes localhost:8080/PROJECT/index.xhtml

I believe I have messed up something with the mappings or the relative paths. I have found some advice that the only mapping should be the one with *.xhtml but I did not really understand why and how to address multiple subfolders of pages.

Any help is appreciated, thanks

AndaP
  • 1,308
  • 8
  • 23
  • 40

2 Answers2

14

The page switches to success.xhtml because I see the content is changed, but the browser URL points to index.xhtml.

This is normal behaviour. The HTML <form action> points to /index.xhtml and the form will thus be submitted to exactly that URL, but behind the scenes, the response is showing the content of /pages/success.xhtml.

If you want a change in the URL, then you need to perform a redirect. You can do that by adding <redirect/> to the <navigation-case> in question.

<navigation-case>
    <from-outcome>success</from-outcome>
    <to-view-id>/pages/success.xhtml</to-view-id>
    <redirect/>
</navigation-case>

See also:

Unrelated to the concrete problem, using navigation cases are soo JSF 1.x. Consider utilizing the new JSF 2.0 implicit navigation feature. This saves you from verbose XML hell.

public String addUser() {
    if (...) {
        return "/pages/success.xhtml?faces-redirect=true";
    } else {
        return "/pages/error.xhtml?faces-redirect=true";
    }
}

I'd however recommend just adding faces messages and then redisplaying the very same page by returning void or null instead of navigating to a "success" or "error" page, that's also how real web forms work. Unless you're doing some "Hello World", of course.

Community
  • 1
  • 1
BalusC
  • 1,082,665
  • 372
  • 3,610
  • 3,555
  • That's great! With the redirect tag, the URL is also changed. I'm not sure what you mean by "just adding faces messages and then redisplaying the very same page by returning void or null". Maybe I can get a link to a more detailed explanation? Thanks a lot for your time – AndaP Oct 05 '12 at 12:35
  • You're welcome. You may find the concrete examples in those articles insightful: [JSF 2.0 tutorial](http://balusc.blogspot.com/2011/01/jsf-20-tutorial-with-eclipse-and.html) and [Communication in JSF 2.0](http://balusc.blogspot.com/2011/09/communication-in-jsf-20.html). – BalusC Oct 05 '12 at 12:36
-1

try this in navigation rule

<navigation-rule>
<from-view-id>/index.jsf</from-view-id> 
<navigation-case>
    <from-outcome>success</from-outcome>
    <to-view-id>/pages/success.jsf</to-view-id>
</navigation-case>
 <navigation-case>
    <from-outcome>error</from-outcome>
    <to-view-id>/pages/error.jsf</to-view-id>
</navigation-case>

divine
  • 1
  • Nope, not working: Unable to find matching navigation case with from-view-id '/index.xhtml' for action '#{userMB.addUser}' with outcome 'success' – AndaP Oct 05 '12 at 12:03
  • You are not explaining in any way *why* and *how* it solves OP's concrete problem. Please do so in future answers. Plus, this doesn't solve the OP's concrete problem at all. – BalusC Oct 05 '12 at 12:17