ONJava.com -- The Independent Source for Enterprise Java
oreilly.comSafari Books Online.Conferences.

advertisement

ONJava Topics
All Articles
Best Practices
Enterprise JavaBeans
Java and XML
Java Data Objects
Java EE (Enterprise)
Java IDE Tools
Java Media
Java SE (Standard)
Java Security
Java SysAdmin
JDO/JDBC/SQLJ
JSP and Servlets
Open Source Java
P2P Java
Web Services
Wireless Java

AddThis Social Bookmark Button

Page Navigation in JavaServer Faces
Pages: 1, 2, 3

Conditional Page Navigation

This section presents an example that demonstrates how to use a navigation rule that has more than one navigation case. The example contains two JSP pages: login.jsp and welcome.jsp. The login.jsp page contains a login form with two UIInput components for the user name and the password. To log in, the user clicks the command button. Upon a successful login, the user will be directed to the welcome.jsp page. If the login failed, the user will see the login.jsp page again, this time with an error message.



The navigation rule for this example is given in Listing 8.

Listing 8. The navigation rule for conditional page navigation

<navigation-rule>
    <from-tree-id>/login.jsp</from-tree-id>

    <navigation-case>
        <from-outcome>success</from-outcome>

        <to-tree-id>/welcome.jsp</to-tree-id>

    </navigation-case>

    <navigation-case>
    <from-outcome>failed</from-outcome>

    <to-tree-id>/login.jsp</to-tree-id>

    </navigation-case>
</navigation-rule>

The navigation-rule element specifies the possible targets for the login.jsp page. For the from-outcome element value of success (a successful login), the welcome.jsp page will be displayed. Otherwise, if the from-outcome element value is failed, the login.jsp page is re-displayed. There is no navigation rule for welcome.jsp, but you can add one yourself.

The login.jsp and welcome.jsp pages are given in Listings 9 and 10 respectively.

Listing 9. login.jsp

<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<html>
<head>
<title>Login</title>
</head>
<body>
<f:use_faces>
<h:form  formName="loginForm">
<h2>Please enter your user name and password</h2>
<br>User Name: <h:input_text
valueRef="LoginBean.userName"/>
<br>Password: <h:input_secret
valueRef="LoginBean.password"/>
<br><h:command_button commandName="login"
label="login"
actionRef="LoginBean.login"/>
<br>
<h:output_errors/>
</h:form>
</f:use_faces>
</body>
</html>

Listing 10. welcome.jsp

<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<html>
<head>
<title>Welcome</title>
</head>
<body>
You logged in successfully.
</body>
</html>

The command_button tag in the login.jsp page has the actionRef attribute with the value of LoginBean.login:

<h:command_button commandName="login" label="login"
	actionRef="LoginBean.login"/>

This means that the outcome of the command button will come from the login property of the LoginBean. The LoginBean is listed in Listing 11. Pay special attention to the LoginAction class, which will be explained after the code listing.

Listing 11. LoginBean

package jsfArticle;

import javax.faces.application.Action;
import javax.faces.application.Message;
import javax.faces.application.MessageImpl;
import javax.faces.context.FacesContext;

public class LoginBean {
    private String userName;
    private String password;
    private Action login;

    public String getUserName() {
        return userName;
    }

    public void setUserName(String userName) {
        this.userName = userName;
    }

    public String getPassword() {
        return password;
    }

    public void setPassword(String password) {
    this.password = password;
    }

    public Action getLogin() {
    if (login==null)
            login = new LoginAction();
        return login;
    }

    class LoginAction extends Action {
        public String invoke() {
            if ("anna".equals(userName) && "honolulu".equals(password))
                return "success";
            else {
                Message loginErrorMessage =
                    new MessageImpl(1, "<hr>Login failed", null);
                FacesContext.getCurrentInstance().addMessage(
                    null, loginErrorMessage);
                return "failed";
            }
        }
    }
}

package ch06;

import javax.faces.application.Action;
import javax.faces.application.Message;
import javax.faces.application.MessageImpl;
import javax.faces.context.FacesContext;

public class LoginBean {
    private String userName;
    private String password;
    private Action login;

    public String getUserName() {
        return userName;
    }

    public void setUserName(String userName) {
        this.userName = userName;
    }

    public String getPassword() {
        return password;
    }

    public void setPassword(String password) { 
        this.password = password;
    }

    public Action getLogin() {
        if (login==null)
            login = new LoginAction();
        return login;
    }

    class LoginAction extends Action {
        public String invoke() {
            if ("ken".equals(userName) && "blackcomb".equals(password))
                return "success";
            else {
                Message loginErrorMessage =
            new MessageImpl(1, "<hr>Login failed", null);
                FacesContext.getCurrentInstance().addMessage(
            null, loginErrorMessage);
                return "failed";
            }
        }
    }
}

For a bean's property to represent an action's outcome, the property must be of type javax.faces.application.Action. The login property has this type:

private Action login;

The getLogin method returns the login Action.

public Action getLogin() {
    if (login==null)
        login = new LoginAction();
    return login;
}

The implementation of the Action class must provide implementation of the invoke method. According to the navigation rule in Listing 8, the value must be either success or failed. These are the possible return values of the invoke method in the LoginAction class. In this case, the correct user name and password are ken anna and blackcombhonolulu, respectively.

The example uses the LoginBean, which is registered in the Application Configuration file using the managed-bean element in Listing 12.

Listing 12. Registering the LoginBean

<managed-bean>
    <managed-bean-name>LoginBean</managed-bean-name>

    <managed-bean-class>jsfArticle.LoginBean</managed-bean-class>

    <managed-bean-scope>session</managed-bean-scope>

  </managed-bean>

You can invoke the login.jsp page using the following URL:

http://localhost:8080/JSFCh0jsfPageNav6/faces/login.jsp

You'll see something similar to Figure 4 in your browser.

The login.jsp page
Figure 4. The login.jsp page

If you type in the correct user name and password, you'll see the welcome.jsp page, as in Figure 5. Otherwise, the login.jsp page will be re-displayed, with an error message, as in Figure 6.

The welcome.jsp page
Figure 5. The welcome.jsp page upon a successful login

A failed login
Figure 6. A failed login

Note that in this example and the previous one, you may use the from-action-ref element, as in Listing 13.

Listing 13. The navigation rule with from-action-ref elements

<navigation-rule>
<from-tree-id>/login.jsp</from-tree-id>

    <navigation-case>
        <from-action-ref>LoginBean.login</from-action-ref>

        <from-outcome>success</from-outcome>

        <to-tree-id>/welcome.jsp</to-tree-id>

    </navigation-case>

    <navigation-case>
        <from-action-ref>LoginBean.login</from-action-ref>

        <from-outcome>failed</from-outcome>

        <to-tree-id>/login.jsp</to-tree-id>

    </navigation-case>
</navigation-rule>

However, this is not necessary, because the possible action values from the bean are all unique.

Using the from-action-ref Element

This example demonstrates that you can get the outcome either from an action-ref attribute or an action attribute. This example uses a login2.jsp, which is similar to login.jsp. However, login2.jsp contains a hyperlink that goes to the help.jsp page when clicked.

Warning: You need to restart your browser to force JSF to create a new instance of the LoginBean.

Listing 14 shows the navigation-rule element in the Application Configuration file.

Listing 14. The navigation rule

<navigation-rule>
    <from-tree-id>/login2.jsp</from-tree-id>

    <navigation-case>
        <from-outcome>success</from-outcome>

        <to-tree-id>/welcome.jsp</to-tree-id>

    </navigation-case>

    <navigation-case>
        <from-outcome>failed</from-outcome>

        <to-tree-id>/login2.jsp</to-tree-id>

    </navigation-case>

    <navigation-case>
        <from-outcome>help</from-outcome>

        <to-tree-id>/help.jsp</to-tree-id>

    </navigation-case>
</navigation-rule>

The login2.jsp page is given in Listing 15, and help.jsp in Listing 16.

Listing 15. login2.jsp

<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<html>
<head>
<title>Login 2</title>
</head>
<body>
<f:use_faces>
<h:form formName="loginForm">
<h2>Please enter your user name and password</h2>
<br>User Name: <h:input_text
valueRef="LoginBean.userName"/>
<br>Password: <h:input_secret
valueRef="LoginBean.password"/>
<br><h:command_button commandName="login"
label="login"
actionRef="LoginBean.login"/>
<br><h:command_hyperlink commandName="forgottenPassword"
action="help"
label="Forgotten your password?"/>
<h:output_errors/>
</h:form>
</f:use_faces>
</body>
</html>

Listing 16. help.jsp

<html>
<head>
<title>Help</title>
</head>
<body>
If you have forgotten your password, please contact the admin
(admin@brainysoftware.com).
</body>
</html>

Now you can invoke login2.jsp using this URL:

http://localhost:8080/JSFCh0jsfPageNav6/faces/login2.jsp

Your browser will display something similar to Figure 7.

The login2.jsp page
Figure 7. The login2.jsp page

If you enter the correct user name and password, you'll see the welcome.jsp page. Typing in the wrong user name and password returns you to the login2.jsp page. If you click the hyperlink, you'll see the help.jsp page in Figure 8.

A failed login
Figure 8. The help.jsp page

However, suppose you use success as the value of the action attribute in the command_hyperlink tag in the page2.jsp page:

<h:command_hyperlink commandName="forgottenPassword"
    action="success" label="Forgotten your password?"/ >

The navigation-rule element would have to be written as follows (this time including the from-action-ref element):

<navigation-rule>
    <from-tree-id>/login2.jsp</from-tree-id>

    <navigation-case>
        <from-action-ref>LoginBean.login</from-action-ref>

        <from-outcome>success</from-outcome>

        <to-tree-id>/welcome.jsp</to-tree-id>

    </navigation-case>

    <navigation-case>
        <from-action-ref>LoginBean.login</from-action-ref>

        <from-outcome>failed</from-outcome>

        <to-tree-id>/login2.jsp</to-tree-id>

    </navigation-case>

    <navigation-case>
        <from-outcome>success</from-outcome>

        <to-tree-id>/help.jsp</to-tree-id>

    </navigation-case>
</navigation-rule>

Conclusion

This article has demonstrated page navigation, a very important aspect of JSF application programming. This article first presented the navigation rules and continued with several examples.

Budi Kurniawan is a senior J2EE architect and author.

Return to ONJava.com.

Recommended for You

Tagged Articles

Be the first to post this article to del.icio.us