Note: JSF 1.2 had a different way of doing things
Let us create two new pages.
In your /src/main/webapp, create a file called international_greets.xhtml, like this:
<!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:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:rich="http://richfaces.org/rich">
<ui:composition template="/templates/template.xhtml">
<ui:define name="title">International Greets</ui:define>
<ui:define name="content">
<p>
English: Hello World!
<br/>
French: Bonjour tout le Monde!
<br/>
Italian: Buongiorno a Tutti!
<br/>
Spanish: Hola Mundo!
<br/>
Swahili: Jambo!
</p>
</ui:define>
</ui:composition>
</html>
In your /src/main/webapp, create a file called american_greets.xhtml, like this:
<!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:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:rich="http://richfaces.org/rich">
<ui:composition template="/templates/template.xhtml">
<ui:define name="title">American Greets</ui:define>
<ui:define name="content">
<p>
Regular: Hi!
<br/>
Friendly: Whatsup!
<br/>
Extra Friendly: Hey, How are you doing!
</p>
</ui:define>
</ui:composition>
</html>
Let us update our HelloBean.java to contain two new methods, which return the above pages by name.
Like this:
package org.confucius;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
@ManagedBean(name="helloBean")
@SessionScoped
public class HelloBean {
private String greeting;
public HelloBean(){
this.greeting = "Hello World JSF!";
}
public String getGreeting() {
return this.greeting;
}
public void setGreeting(String greeting) {
this.greeting = greeting;
}
public String getInternationalGreets() {
return "international_greets";
}
public String getAmericanGreets() {
return "american_greets";
}
}
Now, let us update out greet.xhtml to contain two buttons, which call the above methods.
<!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:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:rich="http://richfaces.org/rich">
<ui:composition template="/templates/template.xhtml">
<ui:define name="title">JSF</ui:define>
<ui:define name="content">
<h1>#{helloBean.greeting}</h1>
<h:form>
<h:commandButton value="Show International Greets" type="submit" action="#{helloBean.getInternationalGreets}" />
<h:commandButton value="Show American Greets" type="submit" action="#{helloBean.getAmericanGreets}" />
</h:form>
</ui:define>
</ui:composition>
</html>
Note that the Buttons have to be enclosed in a Form, otherwise they won't take effect.
This is a very common source of bugs!
If you rebuild and redeploy HelloWorldJSF, you will see the new buttons, which, when clicked direct you to the new pages.
JSF automatically assumes that the return values of the methods are names of pages, extension (.faces) is not required
Important Note:
Sometimes we use the full method name in the EL, like #{helloBean.getAmericanGreets}, while other times we leave out the 'get' part, like #{helloBean.greeting}. Why?
This is because when specified as an action, EL looks for a method with the exact name. When used outside an action specification, EL assumes it is a property field of the bean, and looks for the 'get' method.
