Author: ochikvina
Date: 2009-01-29 12:35:55 -0500 (Thu, 29 Jan 2009)
New Revision: 13343
Added:
branches/jbosstools-3.0.0.CR2/jsf/docs/jsf_tools_tutorial/en/master_output.xml
Log:
https://jira.jboss.org/jira/browse/JBDS-571- adding the master_output.xml;
Added: branches/jbosstools-3.0.0.CR2/jsf/docs/jsf_tools_tutorial/en/master_output.xml
===================================================================
--- branches/jbosstools-3.0.0.CR2/jsf/docs/jsf_tools_tutorial/en/master_output.xml
(rev 0)
+++
branches/jbosstools-3.0.0.CR2/jsf/docs/jsf_tools_tutorial/en/master_output.xml 2009-01-29
17:35:55 UTC (rev 13343)
@@ -0,0 +1,798 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE book PUBLIC "-//OASIS//DTD DocBook XML V4.3//EN"
+"http://www.docbook.org/xml/4.3/docbookx.dtd"
+
+[<!ENTITY introduction SYSTEM "modules/introduction.xml">
+<!ENTITY jsf_application SYSTEM "modules/jsf_application.xml">
+<!ENTITY adding_navigation SYSTEM "modules/adding_navigation.xml">
+<!ENTITY adding_managed_bean SYSTEM "modules/adding_managed_bean.xml">
+<!ENTITY jsp_view_files SYSTEM "modules/jsp_view_files.xml">
+<!ENTITY start_page SYSTEM "modules/start_page.xml">
+<!ENTITY running_application SYSTEM "modules/running_application.xml">
+<!ENTITY relevant_resources SYSTEM "modules/relevant_resources.xml">
+
+<!ENTITY seamlink "../../seam/html_single/index.html">
+<!ENTITY aslink "../../as/html_single/index.html">
+<!ENTITY esblink "../../esb_ref_guide/html_single/index.html">
+<!ENTITY gsglink "../../GettingStartedGuide/html_single/index.html">
+<!ENTITY hibernatelink "../../hibernatetools/html_single/index.html">
+<!ENTITY jbpmlink "../../jbpm/html_single/index.html">
+<!ENTITY jsflink "../../jsf/html_single/index.html">
+<!ENTITY jsfreflink "../../jsf_tools_ref_guide/html_single/index.html">
+<!ENTITY jsftutoriallink
"../../jsf_tools_tutorial/html_single/index.html">
+<!ENTITY strutsreflink
"../../struts_tools_ref_guide/html_single/index.html">
+<!ENTITY strutstutoriallink
"../../struts_tools_tutorial/html_single/index.html">
+
+]><book
xmlns:diffmk="http://diffmk.sf.net/ns/diff">
+
+ <bookinfo>
+ <title>JSF Tools Tutorial</title>
+
+
<author><firstname>Anatoly</firstname><surname>Fedosik</surname></author>
+
<author><firstname>Olga</firstname><surname>Chikvina</surname></author>
+
<author><firstname>Svetlana</firstname><surname>Mukhina</surname><email>smukhina(a)exadel.com</email></author>
+
+ <pubdate>April 2008</pubdate>
+ <copyright>
+ <year>2007</year>
+ <year>2008</year>
+ <holder>JBoss, a division of Red Hat Inc.</holder>
+ </copyright>
+
+ <releaseinfo><diffmk:wrapper diffmk:change="changed">
+ Version: 3.0.0.CR2
+ </diffmk:wrapper></releaseinfo>
+
+
+<abstract>
+ <title></title>
+ <para>
+ <ulink
url="http://download.jboss.org/jbosstools/nightly-docs/en/struts_too...
version</ulink>
+ </para>
+</abstract>
+
+
+ </bookinfo>
+
+ <toc></toc>
+
+
+
+<chapter id="introduction"
xml:base="file:///home/ochikvina/WORK/for_compare/trunk/jsf/docs/jsf_tools_tutorial/en/modules/introduction.xml"
xreflabel="introduction">
+ <?dbhtml filename="introduction.html"?>
+ <chapterinfo>
+ <keywordset>
+ <keyword>JBoss Developer Studio</keyword>
+ <keyword>Eclipse</keyword>
+ <keyword>Java</keyword>
+ <keyword>JBoss</keyword>
+ </keywordset>
+ </chapterinfo>
+ <title>Introduction</title>
+ <para>The following chapters describe how to deal with classic/old style of JSF
development. We
+ recommend users to use <ulink
url="../../seam/html_single/index.html">JBoss
+ Seam</ulink> to simplify development, but until then you can read about
classical JSF
+ usage here.</para>
+
+ <para>Thus, in this document we are going to show you how to create a simple
<property moreinfo="none">JSF application
+ </property>using <property moreinfo="none">JBoss
Tools</property> plugins for Eclipse. The completed
+ application will ask a user to enter a name and click a button. The resulting new
page
+ will display the familiar message, "Hello <name>!" This
+ tutorial will show you how to create and run such an application from the beginning
along the
+ way demonstrating some of the powerful features of <property
moreinfo="none">JBoss Tools</property>.</para>
+
+ <section>
+ <title>Other relevant resources on the topic</title>
+ <para>All JBoss Developer Studio/JBoss Tools documentation you can find
<ulink
url="http://www.jboss.com/products/devstudio/docs">here</...
+ <para>The latest documentation builds are available <ulink
url="http://download.jboss.org/jbosstools/nightly-docs/">her...
+ </section>
+
+</chapter>
+
+
+<chapter id="jsf_application"
xml:base="file:///home/ochikvina/WORK/for_compare/trunk/jsf/docs/jsf_tools_tutorial/en/modules/jsf_application.xml"
xreflabel="jsf_application">
+ <?dbhtml filename="jsf_application.html"?>
+ <chapterinfo>
+ <keywordset>
+ <keyword>JBoss Developer Studio</keyword>
+ <keyword>JSF application</keyword>
+ <keyword>Java</keyword>
+ </keywordset>
+ </chapterinfo>
+
+ <title>Creating a Simple JSF Application</title>
+
+ <para>Firstly, we assume that you have already launched Eclipse with
<property moreinfo="none">JBoss Tools</property>
+ plug-ins installed and also that the <property
moreinfo="none">Web Development perspective</property> is the current
+ one. (If not, make it active by selecting <emphasis>
+ <property moreinfo="none">Window > Open Perspective
> Web Development</property>
+ </emphasis> from the menu bar or by selecting <emphasis>
+ <property moreinfo="none">Window > Open Perspective
> Other...</property>
+ </emphasis> from the menu bar and then selecting <emphasis>
+ <property moreinfo="none">Web Development</property>
+ </emphasis> from the Select Perspective dialog box.)</para>
+
+ <section id="setting_up_the_project">
+ <?dbhtml filename="SettingUpTheProject.html"?>
+ <title>Setting Up the Project</title>
+ <para>Now we are going to create a new project for the
application.</para>
+ <itemizedlist>
+ <listitem>
+ <para>For that go to the menu bar and select <emphasis>
+ <property moreinfo="none">File > New
> Project...</property>
+ </emphasis></para>
+ </listitem>
+ <listitem>
+ <para>Select <emphasis>
+ <property moreinfo="none">JBoss Tools Web
> JSF > JSF Project</property>
+ </emphasis> in the New Project dialog box</para>
+ </listitem>
+ <listitem>
+ <para>Click <emphasis>
+ <property moreinfo="none">Next</property>
+ </emphasis></para>
+ </listitem>
+ <listitem>
+ <para>Enter "jsfHello" as the project name.</para>
+ </listitem>
+ <listitem>
+ <para>Leave everything else as is, and click <emphasis>
+ <property
moreinfo="none">Finish</property>
+ </emphasis></para>
+ </listitem>
+
+ </itemizedlist>
+ </section>
+
+ <section id="TheJSFApplicationConfigurationFile">
+ <?dbhtml filename="TheJSFApplicationConfigurationFile.html"?>
+ <title>JSF Configuration File</title>
+ <para>A jsfHello node should appear in the upper-left Package Explorer
view.</para>
+ <figure float="0">
+ <title>Package Explorer View</title>
+ <mediaobject>
+ <imageobject>
+ <imagedata
fileref="images/jsf_application/jsf_application_1.png"></imagedata>
+ </imageobject>
+ </mediaobject>
+ </figure>
+ <itemizedlist>
+ <listitem>
+ <para>Click the plus sign next to <emphasis>
+ <property
moreinfo="none">jsfHello</property>
+ </emphasis> to reveal the child nodes</para>
+ </listitem>
+ <listitem>
+ <para>Click the plus sign next to <emphasis>
+ <property
moreinfo="none">WebContent</property>
+ </emphasis> under jsfHello</para>
+ </listitem>
+ <listitem>
+ <para>Click the plus sign next to <emphasis>
+ <property
moreinfo="none">WEB-INF</property>
+ </emphasis> under WebContent</para>
+ </listitem>
+
+ <listitem>
+ <para>Then double-click on the <property
moreinfo="none">faces-config.xml</property> node to display
+ the JSF application configuration file editor</para>
+ </listitem>
+ </itemizedlist>
+ <figure float="0">
+ <title>Configuration File Editor</title>
+ <mediaobject>
+ <imageobject>
+ <imagedata
fileref="images/jsf_application/jsf_application_2.png"></imagedata>
+ </imageobject>
+ </mediaobject>
+ </figure>
+
+ </section>
+</chapter>
+
+
+<chapter id="adding_navigation"
xml:base="file:///home/ochikvina/WORK/for_compare/trunk/jsf/docs/jsf_tools_tutorial/en/modules/adding_navigation.xml"
xreflabel="adding_navigation">
+ <?dbhtml filename="adding_navigation.html"?>
+ <chapterinfo>
+ <keywordset>
+ <keyword>JBoss Tools</keyword>
+ <keyword>JSF application</keyword>
+ <keyword>Java</keyword>
+ </keywordset>
+ </chapterinfo>
+
+ <title>Adding Navigation to the Application</title>
+
+ <para>In our simple application, the flow is defined as a single navigation
rule connecting
+ two views (presentation files). At this point, we will create the
placeholders for the
+ two JSP presentation files and then the navigation rule to connect them as
views. Later,
+ we will complete the coding for the JSP presentation files. We can do all of
this in the
+ Diagram mode of the configuration file editor.</para>
+ <section id="AddingTwoViewsJSPPages">
+ <?dbhtml filename="AddingTwoViewsJSPPages.html"?>
+ <title>Adding Two Views (JSP Pages)</title>
+ <itemizedlist>
+ <listitem>
+ <para>Right-click anywhere on the diagram and select
<emphasis>
+ <property moreinfo="none">New
View...</property>
+ </emphasis> from the pop-up menu</para>
+ </listitem>
+ <listitem>
+ <para>In the dialog box, type <emphasis>
+ <property
moreinfo="none">pages/inputname</property>
+ </emphasis> as the value for From-view-id</para>
+ </listitem>
+ <listitem>
+ <para>Leave everything else as is</para>
+ </listitem>
+ <listitem>
+ <para>Click <emphasis>
+ <property
moreinfo="none">Finish</property>
+ </emphasis></para>
+ <para>If you look in the Package Explorer view you should see a
<emphasis>
+ <property moreinfo="none">pages</property>
+ </emphasis> folder under WebContent. Opening it will reveal the
JSP file you
+ just created</para>
+ </listitem>
+ <listitem>
+ <para>Back on the diagram, right-click anywhere and select
<emphasis>
+ <property moreinfo="none">New
View...</property>
+ </emphasis> from the pop-up menu</para>
+ </listitem>
+ <listitem>
+ <para>In the dialog box, type <emphasis>
+ <property
moreinfo="none">pages/greeting</property>
+ </emphasis> as the value for From-view-id</para>
+ </listitem>
+ <listitem>
+ <para>Leave everything else as is</para>
+ </listitem>
+ <listitem>
+ <para>Click <emphasis>
+ <property
moreinfo="none">Finish</property>
+ </emphasis></para>
+ </listitem>
+ </itemizedlist>
+
+ </section>
+ <section id="CreatingTheTransitionNavigationRule">
+ <?dbhtml filename="CreatingTheTransitionNavigationRule.html"?>
+ <title>Creating the Transition (Navigation Rule)</title>
+ <itemizedlist>
+ <listitem>
+ <para>In the diagram, select the connection icon third from the top
along
+ the upper left side of the diagram</para>
+ </listitem>
+ </itemizedlist>
+ <figure float="0">
+ <title>Connection Icon</title>
+ <mediaobject>
+ <imageobject>
+ <imagedata
fileref="images/jsf_application/jsf_application_3.png"></imagedata>
+ </imageobject>
+ </mediaobject>
+ </figure>
+ <para>to get an arrow cursor with a two-pronged plug at the arrow's
bottom.</para>
+ <itemizedlist>
+ <listitem>
+ <para>Click on the <emphasis>
+ <property
moreinfo="none">pages/inputname</property>
+ </emphasis> page icon and then click on the <emphasis>
+ <property
moreinfo="none">pages/greeting</property>
+ </emphasis> page icon</para>
+ </listitem>
+
+ </itemizedlist>
+ <para>A transition should appear between the two icons.</para>
+ <figure float="0">
+ <title>Transition Between Two Icons</title>
+ <mediaobject>
+ <imageobject>
+ <imagedata
fileref="images/jsf_application/jsf_application_4.png"></imagedata>
+ </imageobject>
+ </mediaobject>
+ </figure>
+ <itemizedlist>
+ <listitem>
+ <para>Select <emphasis>
+ <property moreinfo="none">File >
Save</property>
+ </emphasis> from the menu bar</para>
+ </listitem>
+ </itemizedlist>
+ </section>
+
+</chapter>
+
+<chapter id="adding_managed_bean"
xml:base="file:///home/ochikvina/WORK/for_compare/trunk/jsf/docs/jsf_tools_tutorial/en/modules/adding_managed_bean.xml"
xreflabel="adding_managed_bean">
+ <?dbhtml filename="adding_managed_bean.html"?>
+ <chapterinfo>
+ <keywordset>
+ <keyword>JBoss Developer Studio</keyword>
+ <keyword>JSF application</keyword>
+ <keyword>Java</keyword>
+ </keywordset>
+ </chapterinfo>
+
+ <title>Adding a Managed Bean to the Application</title>
+ <para>To store data in the application, we will use a managed
bean.</para>
+ <itemizedlist>
+ <listitem>
+ <para>Click on the <emphasis>
+ <property moreinfo="none">Tree</property>
+ </emphasis> tab at the bottom of the editing window</para>
+ </listitem>
+ <listitem>
+ <para>Select the <emphasis>
+ <property moreinfo="none">Managed
Beans</property>
+ </emphasis> node and then click the <emphasis>
+ <property moreinfo="none">Add...</property>
+ </emphasis> button displayed along the right side of the editor
window</para>
+ </listitem>
+ <listitem>
+ <para>Type in <emphasis>
+ <property
moreinfo="none">jsfHello.PersonBean</property>
+ </emphasis> for Class and <emphasis>
+ <property
moreinfo="none">personBean</property>
+ </emphasis> for Name. Leave Scope as is and Generate Source Code as
is
+ (checked)</para>
+ </listitem>
+ <listitem>
+ <para>Click <emphasis>
+ <property moreinfo="none">Finish</property>
+ </emphasis></para>
+ </listitem>
+ <listitem>
+ <para>personBean will now be selected and three sections of
information: <emphasis>
+ <property moreinfo="none">Managed
Bean</property>
+ </emphasis>, <emphasis>
+ <property
moreinfo="none">Properties</property>
+ </emphasis>, and <emphasis>
+ <property moreinfo="none">Advanced</property>
+ </emphasis>, will be displayed about it. Under the Properties
section, click the <emphasis>
+ <property moreinfo="none">Add...</property>
+ </emphasis> button</para>
+ </listitem>
+ <listitem>
+ <para>Type in <emphasis>
+ <property moreinfo="none">name</property>
+ </emphasis> for Property-Name. Leave everything else as is. (When
Property-
+ Class is not filled in, String is the assumed type)</para>
+ </listitem>
+ <listitem>
+ <para>Click <emphasis>
+ <property moreinfo="none">Finish</property>
+ </emphasis></para>
+ </listitem>
+ <listitem>
+ <para>Select the <emphasis>
+ <property
moreinfo="none">personBean</property>
+ </emphasis> node in the tree</para>
+ </listitem>
+ </itemizedlist>
+ <para>You should see this now:</para>
+ <figure float="0">
+ <title>Tree View in Config Editor</title>
+ <mediaobject>
+ <imageobject>
+ <imagedata
fileref="images/jsf_application/jsf_application_5.png"></imagedata>
+ </imageobject>
+ </mediaobject>
+ </figure>
+ <itemizedlist>
+ <listitem>
+ <para>Select <emphasis>
+ <property moreinfo="none">File >
Save</property>
+ </emphasis> from the menu bar</para>
+ </listitem>
+ </itemizedlist>
+ <para>You have now registered the <emphasis>
+ <property moreinfo="none">managed bean</property>
+ </emphasis> and created a <emphasis>
+ <property moreinfo="none">stub-coded class</property>
+ </emphasis> file for it.</para>
+
+ </chapter>
+
+<chapter id="jsp_view_files"
xml:base="file:///home/ochikvina/WORK/for_compare/trunk/jsf/docs/jsf_tools_tutorial/en/modules/jsp_view_files.xml"
xreflabel="jsp_view_files">
+ <?dbhtml filename="jsp_view_files.html"?>
+ <chapterinfo>
+ <keywordset>
+ <keyword>JBoss Tools</keyword>
+ <keyword>JSF application</keyword>
+ <keyword>Java</keyword>
+ </keywordset>
+ </chapterinfo>
+
+ <title>Editing the JSP View Files</title>
+
+ <para>Now we will finish editing the JSP files for our two
"views" using
+ JSP Visual Page.</para>
+ <section id="Inputname.jsp">
+ <title>inputname.jsp</title>
+ <itemizedlist>
+ <listitem>
+ <para>Click on the <emphasis>
+ <property
moreinfo="none">Diagram</property>
+ </emphasis> tab for the configuration file editor</para>
+ </listitem>
+ <listitem>
+ <para>Open the editor for this first JSP file by
double-clicking on the <emphasis>
+ <property moreinfo="none">/pages/inputname.
jsp</property>
+ </emphasis> icon</para>
+ </listitem>
+ </itemizedlist>
+
+ <para>The Visual Page Editor will open in a screen split between source
code along the
+ top and a WYSIWIG view along the bottom:</para>
+ <figure float="0">
+ <title>Visual Page Editor</title>
+ <mediaobject>
+ <imageobject>
+ <imagedata
fileref="images/jsf_application/jsf_application_6.png"></imagedata>
+ </imageobject>
+ </mediaobject>
+ </figure>
+ <para>Some JSF code is already in the file, because we have chosen a
template to create
+ a page.</para>
+ <itemizedlist>
+ <listitem>
+ <para>Select the <emphasis>
+ <property
moreinfo="none">Visual</property>
+ </emphasis> tab, so we can work with the editor completely in
its WYSIWYG
+ mode</para>
+ </listitem>
+ <listitem>
+ <para>To the right of the editor, in the JBoss Tools Palette,
expand the <emphasis>
+ <property moreinfo="none">JSF
HTML</property>
+ </emphasis> palette folder by selecting it</para>
+ </listitem>
+ </itemizedlist>
+ <figure float="0">
+ <title>JBoss Tools Palette</title>
+ <mediaobject>
+ <imageobject>
+ <imagedata
fileref="images/jsf_application/jsf_application_7.png"></imagedata>
+ </imageobject>
+ </mediaobject>
+ </figure>
+ <itemizedlist>
+ <listitem>
+ <para>Click on <emphasis>
+ <property moreinfo="none">form</property>
+ </emphasis> within this folder, drag the cursor over to the
editor, and drop
+ it inside the red box in the editor</para>
+ </listitem>
+ <listitem>
+ <para>Another red box will appear inside the first red
box</para>
+ </listitem>
+ <listitem>
+ <para>Right-click on the innermost box and select <emphasis
role="bold">
+ <property
moreinfo="none"><h:form></property>
+ </emphasis> Attributes from the menu</para>
+ </listitem>
+ <listitem>
+ <para>In the value field next to id, type <emphasis>
+ <property
moreinfo="none">greeting</property>
+ </emphasis> and click on the <emphasis>
+ <property moreinfo="none">Close</property>
+ </emphasis> button</para>
+ </listitem>
+ <listitem>
+ <para>Type "Please enter name:" inside the
boxes</para>
+ </listitem>
+ <listitem>
+ <para>Select <emphasis>
+ <property
moreinfo="none">inputText</property>
+ </emphasis> within the JSF HTML palette folder and drag it into
the
+ innermost box in the editor after "Please enter
+ name:"</para>
+ </listitem>
+ <listitem>
+ <para>In the attributes dialog, click in the <emphasis>
+ <property moreinfo="none">value</property>
+ </emphasis> field next to the value attribute and click on the
<property moreinfo="none">...
+ </property>button</para>
+ </listitem>
+ <listitem>
+ <para>Then, select the <emphasis>
+ <property moreinfo="none">Managed Beans >
personBean > name</property>
+ </emphasis> node and click on the <emphasis>
+ <property moreinfo="none">Ok</property>
+ </emphasis> button</para>
+ </listitem>
+ <listitem>
+ <para>Back in the attributes dialog, select the
<emphasis>
+ <property
moreinfo="none">Advanced</property>
+ </emphasis> tab, type in <emphasis>
+ <property moreinfo="none">name</property>
+ </emphasis> as the value for the <emphasis
role="italic">
+ <property
moreinfo="none">"id"</property>
+ </emphasis> attribute, and then click on the <emphasis>
+ <property
moreinfo="none">Finish</property>
+ </emphasis> button</para>
+ </listitem>
+ <listitem>
+ <para>Select <emphasis>
+ <property
moreinfo="none">commandButton</property>
+ </emphasis> within the JSF HTML palette folder and drag it into
the
+ innermost box in the editor after the input box</para>
+ </listitem>
+ <listitem>
+ <para>In the attributes dialog, click in the value field next
to the <emphasis role="italic">
+ <property
moreinfo="none">"action"</property>
+ </emphasis> attribute and click on the <property
moreinfo="none">...
+ </property>button</para>
+ </listitem>
+ <listitem>
+ <para>Then, select the <emphasis>
+ <property moreinfo="none">View Actions >
greeting</property>
+ </emphasis> node and click on the <emphasis>
+ <property moreinfo="none">OK</property>
+ </emphasis> button</para>
+ </listitem>
+ <listitem>
+ <para>Back in the attributes dialog box, type in "Say
Hello"
+ as the value for the value attribute ("Say Hello") and
+ then click on the <emphasis>
+ <property
moreinfo="none">Finish</property>
+ </emphasis> button</para>
+ </listitem>
+ </itemizedlist>
+ <para>The source coding should be something like this
now:</para>
+ <programlisting format="linespecific"
role="XML"><![CDATA[<%@ taglib
uri="http://java.sun.com/jsf/html" prefix="h" %>
+<%@ taglib
uri="http://java.sun.com/jsf/core" prefix="f" %>
+<html>
+<head>
+<title></title>
+</head>
+<body>
+<f:view>
+<h:form id="greeting">
+<para>Please enter a name:</para>
+<h:inputText id="name" value="#{personBean.name}"/>
+<h:commandButton value=" Say Hello " action="greeting"/>
+</h:form>
+</f:view>
+</body>
+</html>
+]]></programlisting>
+ <para>The editor should look like this:</para>
+ <figure float="0">
+ <title>Visual Page Editor</title>
+ <mediaobject>
+ <imageobject>
+ <imagedata
fileref="images/jsf_application/jsf_application_8.png"></imagedata>
+ </imageobject>
+ </mediaobject>
+ </figure>
+ <itemizedlist>
+ <listitem>
+ <para>Save the file by selecting <emphasis>
+ <property moreinfo="none">File >
Save</property>
+ </emphasis> from the menu bar</para>
+ </listitem>
+ </itemizedlist>
+ </section>
+ <section id="Greeting.jsp">
+ <title>greeting.jsp</title>
+ <itemizedlist>
+ <listitem>
+ <para>Click on the <emphasis>
+ <property
moreinfo="none">faces-config.xml</property>
+ </emphasis> tab to bring the diagram back</para>
+ </listitem>
+ <listitem>
+ <para>Open the editor for the second file by double-clicking on
the <emphasis>
+ <property
moreinfo="none">/pages/greeting.jsp</property>
+ </emphasis> icon</para>
+ </listitem>
+ <listitem>
+ <para>Select the <emphasis>
+ <property
moreinfo="none">Visual</property>
+ </emphasis> tab, so we can work with the editor completely in
its WYSIWYG
+ mode</para>
+ </listitem>
+ <listitem>
+ <para>Type "Hello "(note space after Hello) into the
+ box</para>
+ </listitem>
+ <listitem>
+ <para>Select <emphasis>
+ <property
moreinfo="none">outputText</property>
+ </emphasis> within the JSF HTML palette folder and drag it into
the
+ innermost box in the editor after "Hello"</para>
+ </listitem>
+ <listitem>
+ <para>In the attributes dialog, click in <emphasis>
+ <property moreinfo="none">value</property>
+ </emphasis> field next to the value attribute and click on the
+ <property moreinfo="none">...</property>
(Browse) button</para>
+ </listitem>
+ <listitem>
+ <para>Then, select the <emphasis>
+ <property moreinfo="none">Managed Beans >
personBean > name</property>
+ </emphasis> node, click on the <emphasis>
+ <property moreinfo="none">Ok</property>
+ </emphasis> button, and then click on the <emphasis>
+ <property
moreinfo="none">Finish</property>
+ </emphasis> button</para>
+ </listitem>
+ <listitem>
+ <para>Right after the output field, type an <emphasis>
+ <property moreinfo="none">exclamation
point</property>
+ </emphasis> (<emphasis>
+ <property moreinfo="none">!</property>
+ </emphasis>)</para>
+ </listitem>
+ </itemizedlist>
+ <para>The source coding should be something like this
now:</para>
+ <programlisting format="linespecific"
role="XML"><![CDATA[<%@ taglib
uri="http://java.sun.com/jsf/html" prefix="h" %>
+<%@ taglib
uri="http://java.sun.com/jsf/core" prefix="f" %>
+<html>
+<head>
+<title></title>
+</head>
+<body>
+<f:view>
+Hello <h:outputText value="#{personBean.name}"/>!
+</f:view>
+</body>
+</html>
+]]></programlisting>
+ <itemizedlist>
+ <listitem>
+ <para>Save the file</para>
+ </listitem>
+ </itemizedlist>
+ </section>
+ </chapter>
+
+<chapter id="start_page"
xml:base="file:///home/ochikvina/WORK/for_compare/trunk/jsf/docs/jsf_tools_tutorial/en/modules/start_page.xml"
xreflabel="start_page">
+ <?dbhtml filename="start_page.html"?>
+ <chapterinfo>
+ <keywordset>
+ <keyword>JBoss Tools</keyword>
+ <keyword>JSF application</keyword>
+ <keyword>Java</keyword>
+ </keywordset>
+ </chapterinfo>
+
+ <title>Creating the Start Page</title>
+ <para>You also need to create a start page as an entry point into the
application.</para>
+ <itemizedlist>
+ <listitem>
+ <para>In the Package Explorer view to the left, right-click
<emphasis>
+ <property moreinfo="none">jsfHello >
WebContent</property>
+ </emphasis> and select <emphasis>
+ <property moreinfo="none">New > JSP
File</property>
+ </emphasis></para>
+ </listitem>
+ <listitem>
+ <para>For Name type in <emphasis>
+ <property moreinfo="none">index</property>
+ </emphasis>, for Template select <emphasis>
+ <property
moreinfo="none">JSPRedirect</property>
+ </emphasis> and click <emphasis>
+ <property moreinfo="none">Finish</property>
+ </emphasis></para>
+ </listitem>
+ </itemizedlist>
+ <para>A JSP editor will open up on the newly created file.</para>
+
+ <itemizedlist>
+ <listitem>
+ <para>In the Source part of the split screen, type
<emphasis>
+ <property
moreinfo="none">/pages/inputname.jsf</property>
+ </emphasis> in between the quotes for the page
attribute</para>
+ </listitem>
+ </itemizedlist>
+ <para>The source coding should look like this now:</para>
+ <programlisting format="linespecific"
role="XML"><![CDATA[<!doctype html public "-//w3c//dtd html 4.0
transitional//en">
+<html>
+<head></head>
+<body>
+<jsp:forward page="/pages/inputname.jsf" />
+</body>
+</html>
+]]></programlisting>
+
+ <para>Note the <emphasis>
+ <property moreinfo="none">.jsf</property>
+ </emphasis> extension for the file name. This is a mapping defined in the
web.xml file
+ for the project for invoking <property
moreinfo="none">JavaServer Faces</property> when you run the
+ application.</para>
+ <itemizedlist>
+ <listitem>
+ <para>Select<emphasis>
+ <property moreinfo="none"> File >
Save</property>
+ </emphasis> from the menu bar</para>
+ </listitem>
+ </itemizedlist>
+ </chapter>
+
+<chapter id="running_application"
xml:base="file:///home/ochikvina/WORK/for_compare/trunk/jsf/docs/jsf_tools_tutorial/en/modules/running_application.xml"
xreflabel="running_application">
+ <?dbhtml filename="running_application.html"?>
+ <chapterinfo>
+ <keywordset>
+ <keyword>JBoss Tools</keyword>
+ <keyword>JSF application</keyword>
+ <keyword>Java</keyword>
+ </keywordset>
+ </chapterinfo>
+
+ <title>Running the Application</title>
+ <para>Everything is now ready for running our application by using the
JBoss engine. For
+ controlling JBoss server there is JBoss Server view:</para>
+ <figure float="0">
+ <title>JBoss Server View</title>
+ <mediaobject>
+ <imageobject>
+ <imagedata
fileref="images/jsf_application/jsf_application_9.png"></imagedata>
+ </imageobject>
+ </mediaobject>
+ </figure>
+ <itemizedlist>
+ <listitem>
+ <para>Start up JBoss by clicking on the icon in JBoss Server view.
(If JBoss is
+ already running, stop it by clicking on the red icon and then start
it again.
+ Remember, the JSF run-time requires restarting the servlet engine
when any
+ changes have been made.) After the messages in the Console tabbed
view stop
+ scrolling, JBoss is available</para>
+ </listitem>
+
+ <listitem>
+ <para>Click the Run icon or right click your project folder and
select <emphasis>
+ <property moreinfo="none">Run As > Run on
Server</property>
+ </emphasis>:</para>
+ </listitem>
+ </itemizedlist>
+ <figure float="0">
+ <title>Run Icon</title>
+ <mediaobject>
+ <imageobject>
+ <imagedata
fileref="images/jsf_application/jsf_application_10.png"></imagedata>
+ </imageobject>
+ </mediaobject>
+ </figure>
+ <para>This is the equivalent of launching the browser and typing
<emphasis>
+ <property
moreinfo="none">http://localhost:8080/jsfHello</property>
+ </emphasis> into your browser. Our <property
moreinfo="none">JSF application</property> should now
+ appear.</para>
+ </chapter>
+
+<chapter id="relevant_resources"
xml:base="file:///home/ochikvina/WORK/for_compare/trunk/jsf/docs/jsf_tools_tutorial/en/modules/relevant_resources.xml"
xreflabel="relevant_resources">
+ <?dbhtml filename="relevant_resources.html"?>
+ <chapterinfo>
+ <keywordset>
+ <keyword>JBoss Tools</keyword>
+ <keyword>JSF application</keyword>
+ <keyword>Java</keyword>
+ </keywordset>
+ </chapterinfo>
+
+ <title>Other Relevant Resources on the topic</title>
+ <para>JSF on Sun: <ulink
url="http://java.sun.com/javaee/javaserverfaces/">JavaServer Faces
+ Technology</ulink></para>
+ <para>Core JSF: <ulink
url="http://www.horstmann.com/corejsf/">Core JavaServer
Faces</ulink></para>
+ <para>API: <ulink
url="http://java.sun.com/javaee/javaserverfaces/1.1/docs/api/index.h...
+ API</ulink></para>
+ <para>JSF Tags: <ulink
url="http://www.horstmann.com/corejsf/jsf-tags.html">JSF Core
+ Tags</ulink></para>
+ <para>HTML Tags Reference: <ulink
url="http://www.exadel.com/tutorial/jsf/jsftags-guide.html">JSF HTML Tags
Reference</ulink></para>
+ <para>JSF Central: <ulink
url="http://www.jsfcentral.com/">JSF
Central - Your JavaServer Faces
+ Community</ulink></para>
+ <para>FAQ: <ulink
url="http://wiki.java.net/bin/view/Projects/JavaServerFacesSpecFaq&q...
+ FAQ</ulink></para>
+ <para>Download: <ulink
url="http://java.sun.com/javaee/javaserverfaces/download.html"&...
+ Faces Technology - Download</ulink></para>
+
+ <para>In summary, with this tutorial you should now know how to organize JSF
sample application
+ using the wizards provided by <property moreinfo="none">JBoss
Tools</property>, configure its stuff and
+ finally run it on the <property moreinfo="none">JBoss
Server</property>.</para>
+
+ <para>Find out more features on JSF tooling in our <ulink
url="../../jsf_tools_ref_guide/html_single/index.html">JSF Tools
+ Reference Guide</ulink>. If you have questions and suggestions, please
refer to <ulink
url="http://www.jboss.com/index.html?module=bb&op=viewforum&...
+ Tools Forum</ulink>.</para>
+</chapter>
+
+</book>