Second JSF Tutorial with Eclipse, Tomcat

Using JSF with Eclipse, we create a java class used to navigate to a second xhtml page and also create that second xhtml page.

Previous tutorial was here

  1. Modify the index.xhtml to include this the code as listed below.
  2. Create page2.xhtml in the same folder as index.xhtml and use the code below.
  3. Create a class by right-clicking on the project name (JsfTut)/New class.  Name it MyPageClass.java and include the code below
  4. Right click on the project (JsfTut), and run on server.

index.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:h="http://xmlns.jcp.org/jsf/html">
<h:head>
<title>JsfTut</title>
</h:head>
<h:body>
<h1>Congrats, this works!</h1>

<h:form>
Let's go to a new page:
<h:commandButton value="Click for page 2"
action="#{myPageClass.nextPage}"/>
</h:form>

</h:body></html>

page2.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:h="http://xmlns.jcp.org/jsf/html">
<h:head>
<title>Page2</title>
</h:head>
<h:body>
<h1>This is page 2 :)</h1>

</h:body></html>

MyPageClass.java

import javax.faces.bean.ManagedBean;

@ManagedBean
public class MyPageClass {

 public String nextPage() {
 return "page2";
 }
}

Found this useful?  Share the luv, and leave a comment 🙂

Advertisements

About SunKing2

Former web developer, guitar player, started Piano 2012 -yes still doing it! Recovery, sobriety, mental health advocate.
This entry was posted in Uncategorized. Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s