JSF 2 Dynamic Target View ID (to-view-id) Example

The to-view-id element can be a value expression, in which case it is evaluated. The result is used as the view ID. This type of providing of to-view-id isn’t implemented before JSF 2.0. This

Also Read:

1. Managed Bean

IndexBean.java

package net.javabeat.jsf;

import javax.faces.application.FacesMessage;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
import javax.faces.context.FacesContext;

@ManagedBean
@SessionScoped
public class IndexBean {
	private String username;
	private String password;
	private String nextView;

	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 String getNextView() {
		return nextView;
	}
	public void setNextView(String nextView) {
		this.nextView = nextView;
	}

	public String login(){
		if(this.username.equalsIgnoreCase("javabeat") &&
				this.password.equals("javabeat")){
			return "welcome";
		}
		else {
			FacesContext.getCurrentInstance().addMessage(null,
                             new FacesMessage("You're username or password isn't valid"));
			return "login";
		}

	}

	public String logout(){
		this.nextView = "login";
		return "logout";
	}

	public String expensesView(){
		this.nextView = "expensesView";
		return "expenses";
	}
}

2. The views

login.xhtml

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core">
<h:head>
	<h:outputScript library="javax.faces" name="jsf.js"/>
</h:head>
<h:body>
	<f:view>
		<h1>JavaBeat JSF 2.2 Examples</h1>
		<h2>JSF2 Dynamic Navigation - Redirect Example</h2>
		<h:form prependId="false">
			<h:messages globalOnly="true" style="color:red"></h:messages>
			<h:panelGrid columns="2">
				<h:outputText value="Enter Username: "/>
				<h:inputText value="#{indexBean.username}"/>
				<h:outputText value="Enter Password: "/>
				<h:inputText value="#{indexBean.password}"/>
			</h:panelGrid>
			<h:commandButton value="Login" action="#{indexBean.login}"></h:commandButton>
		</h:form>
	</f:view>
</h:body>
</html>

welcome.xhtml

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core">
	<f:view>
		<h:form>
			<h1>JavaBeat JSF 2.2 Examples</h1>
			<h2>JSF2 Dynamic Navigation - Redirect Example</h2>
			<h:outputText value="Welcome Mr.#{indexBean.username}"/>
			<br/>
			<h:commandLink value="Logout" action="#{indexBean.logout}"/>
			#{' '}
			<h:commandLink value="Expenses" action="#{indexBean.expensesView}"/>
		</h:form>
	</f:view>
</html>

expensesView.xhtml

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core">
	<f:view>
		<h:form>
			<h1>JavaBeat JSF 2.2 Examples</h1>
			<h2>JSF2 Dynamic Navigation - Redirect Example</h2>
			<h:panelGrid columns="2">
				<h:outputText value="Oil"/>
				<h:outputText value="20 USD"/>
				<h:outputText value="House"/>
				<h:outputText value="50 USD"/>
				<h:outputText value="Schools"/>
				<h:outputText value="200 USD"/>
			</h:panelGrid>
			<br/>
			<h:commandButton value="logout" action="login?faces-redirect=true"/>
		</h:form>
	</f:view>
</html>

3. Faces Configuration File

faces-config.xml

<?xml version="1.0" encoding="UTF-8"?>
<faces-config xmlns="http://xmlns.jcp.org/xml/ns/javaee"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee

http://xmlns.jcp.org/xml/ns/javaee/web-facesconfig_2_2.xsd"

	version="2.2">
<application>
	<resource-bundle>
		<base-name>net.javabeat.jsf.application</base-name>
		<var>msg</var>
	</resource-bundle>
</application>
<navigation-rule>
	<from-view-id>/welcome.xhtml</from-view-id>
	<navigation-case>
		<to-view-id>#{indexBean.nextView}</to-view-id>
		<redirect/>
	</navigation-case>
</navigation-rule>
</faces-config>

4. The Deployment Descriptor (web.xml)

web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
	xsi:schemaLocation="http://java.sun.com/xml/ns/javaee

http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"

	id="WebApp_ID" version="2.5" metadata-complete="true">
	<context-param>
		<description>State saving method: 'client' or 'server'
						(=default). See JSF Specification 2.5.2
		</description>
		<param-name>javax.faces.STATE_SAVING_METHOD</param-name>
		<param-value>client</param-value>
	</context-param>
	<context-param>
		<param-name>javax.faces.application.CONFIG_FILES</param-name>
		<param-value>/WEB-INF/faces-config.xml</param-value>
	</context-param>
	<servlet>
		<servlet-name>Faces Servlet</servlet-name>
		<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
		<load-on-startup>1</load-on-startup>
	</servlet>
	<servlet-mapping>
		<servlet-name>Faces Servlet</servlet-name>
		<url-pattern>/faces/*</url-pattern>
	</servlet-mapping>
	<servlet-mapping>
		<servlet-name>Faces Servlet</servlet-name>
		<url-pattern>*.xhtml</url-pattern>
	</servlet-mapping>
	<listener>
		<listener-class>com.sun.faces.config.ConfigureListener</listener-class>
	</listener>
</web-app>

5. JSF 2 Dynamic Target View Demo

The below snapshots will show you the impact of using dynamic target view in the navigation.

JSF 2 Dyanmic View Example 1

JSF 2 Dynamic View Example 2

JSF 2 Dynamic View Example 3

  • If you’ve noted that the faces-config.xml doesn’t provide neither navigation rule and nor string outcome for navigating from welcome.xhtml into expensesView or into login view via expenses and logout actions respectively.
  • The navigation has been done through by means of providing a dynamic target view expression #{indexBean.nextView}

Comments

comments

About Amr Mohammed

Speak Your Mind

*