JBoss RichFaces 3.3 - Filocamo Demetrio - E-Book

JBoss RichFaces 3.3 E-Book

Filocamo Demetrio

0,0
20,73 €

-100%
Sammeln Sie Punkte in unserem Gutscheinprogramm und kaufen Sie E-Books und Hörbücher mit bis zu 100% Rabatt.

Mehr erfahren.
Beschreibung

In Detail

JBoss RichFaces is a rich component library for JavaServer Faces and an AJAX framework that allows easy integration of AJAX capabilities into complex business applications. Do you wish to eliminate the time involved in writing JavaScript code and managing JavaScript-compatibility between browsers to build an AJAX web application quickly?

This book goes beyond the documentation to teach you how to do that. It will show you how to get the most out of JBoss RichFaces by explaining the key components and how you can use them to enhance your applications. Most importantly, you will learn how to integrate AJAX into your applications without using JavaScript but only standard JSF components. You will learn how to create and customize your own components and add them to your new or existing applications.

First, the book introduces you to JBoss RichFaces and its components. It uses many examples of AJAX components which, among others, include: Calendar, Data Table, ToolTip, ToolBar, Menu, RichEditor, Drag'n'Drop. All these components will help you create the web site you always imagined. Key aspects of the RichFaces framework such as the AJAX framework, skinnability, and CDK (Component Development Kit) will help you customize the look of your web application. As you progress through the book, you will see a sample application that shows you how to build an advanced contact manager. You're also going to be amazed to know about the advanced topics you will learn like developing new components, new skins, optimizing a web application, inserting components dynamically using Java instead of XHTML, and using JavaScript to manage components. This book is more than a reference with component example code: it's a manual that will guide you, step-by-step, through the development of a real AJAX JSF web application.

Develop a real AJAX web application productively using the RichFaces framework, Facelets, and Seam

Approach

This is a practical tutorial following the use of RichFaces in a sample application. It includes many examples of the creation and customization of different AJAX components.

Who this book is for

This book targets Java Developers who want to enhance their JSF applications by adding AJAX, but without having to use JavaScript. If you want to learn how to use the wide set of AJAX components that you find in the RichFaces framework, this book is for you.
You are expected to have basic knowledge of JSF, but no previous experience with AJAX is necessary.

Sie lesen das E-Book in den Legimi-Apps auf:

Android
iOS
von Legimi
zertifizierten E-Readern

Seitenzahl: 276

Veröffentlichungsjahr: 2009

Bewertungen
0,0
0
0
0
0
0
Mehr Informationen
Mehr Informationen
Legimi prüft nicht, ob Rezensionen von Nutzern stammen, die den betreffenden Titel tatsächlich gekauft oder gelesen/gehört haben. Wir entfernen aber gefälschte Rezensionen.



Table of Contents

JBoss RichFaces 3.3
Credits
About the Author
About the Reviewer
Preface
What this book covers
Who this book is for
Conventions
Reader feedback
Customer support
Errata
Piracy
Questions
1. What is RichFaces?
An overview of RichFaces
A bit of history
The Ajax framework
Ajax Action Components
Ajax Containers
Ajax placeholders
Ajax validators
RichFaces components overview
RichFaces skinnability overview
Summary
2. Getting Ready
Creating a RichFaces JSF project the simple way
Seam-gen
Download and install seam-gen
Generating a project using seam-gen
Update RichFaces libraries in a seam-gen generated project
Overview of the project structure
Incremental hot deployment
Seam and Facelets support
Adding RichFaces manually to your existing JSF project
Downloading RichFaces
Basic configuration
Where to put the libraries
Registering RichFaces
Facelets support
IDEs
Eclipse/JBoss Tools
Where to download and how to install it
JBoss Developer Studio
Importing a seam-gen generated project into Eclipse
IntelliJ Idea
Where to download and how to install it
Summary
3. First Steps
A simple contact manager
Creating the new project
Templating and Facelets
Modifying the created project
The model
The managed bean
Making it a managed bean
The "Insert new contact" form
The main box
The form fields
Using RichFaces message and messages components instead of the standard ones
Validating our field in a simple way
Adding Ajax to standard JSF components: a4j:support
Calendar field
Simple layout components: rich:separator and rich:spacer
Ajax command buttons: a4j:commandButton
Ajax command links: a4j:commandLink
The contact list
Re-rendering the contact list after adding a new contact
Adding the delete button
Summary
4. The Application
What we are going to develop?
Features
Groups manager
File uploads and notes
Simple search
User skin
Multilanguage
The database: E-R diagram
Importing the database
Creating the project
The class diagram
Some modification to the entities
Editing the template page
The menu page
The login page
The home page
Summary
5. Making the Application Structure
Skinnability and dynamic skin change
Selecting the application skin
User-selected application skin
Passing application parameters using components.xml
Making skin selection user-dependent
Standard controls skinning
XCSS and Plug-n-Skin
Adding built-in plug'n'skin skins
Some examples
Internationalization
Configuration
Internationalize strings
User-selected language
Persist the selected locale using a cookie
Menu bar using rich:toolBar component
Making the login work
User registration
Creating the page structure
Creating the support bean
Creating the form fields and action buttons
Adding the validation rules
Adding the sign up link to the menu bar
Validating the password against another "Rewrite password" field
Making your own validators
Using a captcha
Resetting the captcha
Automatic login after registration
Sending the confirmation emails
Screenshot
Reset password box
Forgot username box
URL rewriting: making it simple and powerful
Summary
6. Making the Contacts List and Detail
The main layout
Ajax placeholders
The groups box
The contacts list
Differences between h:dataTable and rich:dataTable
Data pagination
Adding the column headers
Columns and column groups
Out-of-the-box filtering and sorting
The bottom toolbar
The backing bean
The contact detail
The support bean
Selecting the contact from the contacts list
Adding a new contact
Viewing contact detail
Editing contact detail
The button toolbar
The ajaxSingle and the process attributes
More Ajax!
Ajax containers
Data iteration using RichFaces
Data pagination with data iteration components
Addresses management
Some screenshots
Summary
7. Finishing the Application
Taking a note of every contact
A richer editor
Let's group our contacts
Listing, adding, and removing groups
Other features of the rich:toolTip component
Adding and editing groups
The adding/editing form
Adding contacts to a group using the drag 'n' drop
Removing contacts from a group using drag'n'drop
Attaching files
Creating the wizard
The file review step
Creating the modal panel
Control components without JavaScript
Inserting the wizard inside the modal panel
Finishing the file upload feature
Summary
8. Skin Customization
Skinnability
Customize skin parameters
Edit a basic skin
Using CSS
Redefine the skin-inserted CSS classes
Specify our specific CSS classes
Using skins with non-skinnable components
Standard controls skinning
XCSS
Summary
9. Creating a New plug 'n' skin
Installing Maven
Creating the new skin
Customizing the new skin
Packaging and deploying the new skin
Summary
10. Advanced Techniques
Poll
Creating images dynamically
Push
Creating a RichFaces JavaScript function
Partial update of data iteration components
RichFaces component binding in JBoss Seam / JBoss Application Server environment
Moving all the libraries to the EAR
A simple binding example
The tree component
State saving
Action listeners
Controlling the session expiration
Summary
11. Component Development Kit
Configuring the environment
Installing Maven
Configuring
Creating the project
Generating the template
Testing the template
Creating the component
Component configuration
Component resources
Component renderer
Testing the new component
Summary
A. RichFaces Components Overview
Ajax sup0port
a4j:ajaxListener
a4j:actionparam
a4j:commandButton
a4j:commandLink
a4j:form
a4j:htmlCommandLink
a4j:jsFunction
a4j:poll
a4j:push
a4j:region
a4j:status
a4j:support
Resources/beans handling
a4j:keepAlive
a4j:loadBundle
a4j:loadScript
a4j:loadStyle
Ajax Validators
rich:ajaxValidator
rich:graphValidator
rich:beanValidator
Ajax output
a4j:include
a4j:mediaOutput
a4j:outputPanel
Ajax miscellaneous
a4j:log
a4j:page
a4j:portlet
Data iteration
a4j:repeat
rich:columns
rich:columnGroup
rich:column
rich:dataGrid
rich:dataList
rich:dataOrderedList
rich:dataDefinitionList
rich:dataFilterSlider
rich:datascroller
rich:dataTable
rich:subTable
rich:extendedDataTable
rich:scrollableDataTable
Drag-and-drop support
rich:dndParam
rich:dragIndicator
rich:dragSupport
rich:dropSupport
rich:dragListener
rich:dropListener
Rich Menu
rich:contextMenu
rich:dropDownMenu
rich:menuGroup
rich:menuItem
rich:menuSeparator
Rich trees
rich:tree
rich:treeNode
rich:changeExpandListener
rich:nodeSelectListener
rich:recursiveTreeNodesAdaptor
rich:treeNodesAdaptor
Rich output
rich:modalPanel
rich:paint2D
rich:panel
rich:panelBar
rich:panelBarItem
rich:panelMenu
rich:panelMenuGroup
rich:panelMenuItem
rich:progressBar
rich:separator
rich:simpleTogglePanel
rich:spacer
rich:tabPanel
rich:tab
rich:togglePanel
rich:toggleControl
rich:toolBar
rich:toolBarGroup
rich:toolTip
Rich input
rich:calendar
rich:comboBox
rich:fileUpload
rich:inplaceInput
rich:inplaceSelect
rich:inputNumberSlider
rich:inputNumberSpinner
rich:suggestionbox
Rich Selects
rich:listShuttle
rich:orderingList
rich:pickList
Rich miscellaneous
rich:componentControl
rich:effect
rich:gmap
rich:virtualEarth
rich:hotKey
rich:insert
rich:jQuery
rich:message
rich:messages
JSF 2 and RichFaces 4
RichFaces 3.3.X
JSF 2.0
RichFaces 4.X
Index

JBoss RichFaces 3.3

Demetrio Filocamo

JBoss RichFaces 3.3

Copyright © 2009 Packt Publishing

All rights reserved. No part of this book may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written permission of the publisher, except in the case of brief quotations embedded in critical articles or reviews.

Every effort has been made in the preparation of this book to ensure the accuracy of the information presented. However, the information contained in this book is sold without warranty, either express or implied. Neither the author, nor Packt Publishing, and its dealers and distributors will be held liable for any damages caused or alleged to be caused directly or indirectly by this book.

Packt Publishing has endeavored to provide trademark information about all of the companies and products mentioned in this book by the appropriate use of capitals. However, Packt Publishing cannot guarantee the accuracy of this information.

First published: November 2009

Production Reference: 1231009

Published by Packt Publishing Ltd.

32 Lincoln Road

Olton

Birmingham, B27 6PA, UK.

ISBN 978-1-847196-88-0

www.packtpub.com

Cover Image by Filippo (<[email protected]>)

Credits

Author

Demetrio Filocamo

Reviewer

Allan Lykke Christensen

Acquisition Editor

Sarah Cullington

Development Editor

Swapna V. Verlekar

Technical Editor

Charumathi Sankaran

Copy Editor

Sanchari Mukherjee

Indexers

Rekha Nair

Monica Ajmera

Editorial Team Leader

Gagandeep Singh

Project Team Leader

Lata Basantani

Project Coordinator

Srimoyee Ghoshal

Proofreader

Lynda Sliwoski

Graphics

Nilesh R. Mohite

Production Coordinators

Adline Swetha Jesuthas

Dolly Dasilva

Cover Work

Adline Swetha Jesuthas

About the Author

Demetrio Filocamo is a computer science engineer with more than 10 years of experience with both Desktop and web applications development. He works as a consultant in London and collaborates with some companies and universities in Italy. Demetrio has been developing Enterprise Java Applications using open source solutions for the last five years.

About the Reviewer

Allan Lykke Christensen is the vice-president of Danish ICT Management, an international consulting firm with its focus on ICT in developing economies. He is responsible for daily management of teams in Uganda, Bangladesh, and Denmark. In his daily work, he is also responsible for project planning, initiating, and overall implementation. He has been developing and implementing IT projects for more than 10 years. His expertise covers a wide range—he has developed workflow systems, information systems, e-learning tools, knowledge management systems, and websites. He has worked as a team leader on several major European Commission-financed ICT projects in various developing economies. He has co-authored The Definitive Guide toApache MyFaces and Facelets (Apress, 2008) and made countless presentations and training sessions on programming-related topics around the world.

To my grandfather Demetrio, my family and Maria Chiara.

Preface

JBoss RichFaces is a rich component library for JavaServer Faces and an AJAX framework that allows easy integration of Ajax capabilities into complex business applications. Do you wish to eliminate the time involved in writing JavaScript code and managing JavaScript-compatibility between browsers to build an Ajax web application quickly?

This book goes beyond the documentation to teach you how to do that. It will show you how to get the most out of JBoss RichFaces by explaining the key components and how you can use them to enhance your applications. Most importantly, you will learn how to integrate Ajax into your applications without using JavaScript, but only standard JSF components. You will learn how to create and customize your own components and add them to your new or existing applications.

First, the book introduces you to JBoss RichFaces and its components. It uses many examples of Ajax components which, among others, include: Calendar, Data Table, ToolTip, ToolBar, Menu, RichEditor, and Drag 'n' Drop. All these components will help you create the web site you always imagined. Key aspects of the RichFaces framework such as the Ajax framework, skinnability, and ComponentDevelopmentKit (CDK) will help you customize the look of your web application. As you progress through the book, you will see a sample application that shows you how to build an advanced contact manager. You're also going to be amazed to know about the advanced topics you will learn such as developing new components, new skins, optimizing a web application, inserting components dynamically using Java instead of XHTML, and using JavaScript to manage components. This book is more than a reference with component example code: it's a manual that will guide you, step by step, through the development of a real Ajax JSF web application.

What this book covers

Chapter 1: What is RichFaces covers the aims of the RichFaces framework, its components, and what you can do by using it in a web application.

Chapter 2: Getting Ready explains how to configure your environment by creating a simple project using the seam-gen tool, adding support to Seam and Facelets, and the manual configuration for the RichFaces libraries. We will understand the IDE that we can use while developing with the framework.

In Chapter 3: First Steps, you will learn to build Ajax applications by developing a simple example, the basics of RichFaces step by step, from creating the project to editing the code, using very important components and their Ajax properties.

Chapter 4: The Application covers how to create the basics of our project by having a look at the side technologies we might know, in order to build good applications. It will cover templating with Facelets, JBoss Seam authentication, and customization of the entities.

Chapter 5: Making the Application Structure explains us how to create the login and registration system of the website. We'll look at all the features that a real application might have.

In Chapter 6: Making the Contacts List and Detail, we will develop the core feature of our application—contact management. We'll learn about Ajax interaction and containers, and about new Ajax components that RichFaces offers.

Chapter 7: Finishing the Application explains how to finish building the application using the RichFaces components, and about customizing them.

In Chapter 8: Skin Customization, we'll see all the powerful customization capabilities that the RichFaces framework offers.

Chapter 9: Creating a New plug 'n' skin covers how to create, customize, and package and deploy a new pluggable skin.

Chapter 10: Advanced Techniques explains you how to use and implement pushing, partial updates, and session expiration handling in order to develop advanced applications.

In Chapter 11: Component Development Kit, we'll see how to start a project in order to develop a simple JSF Ajax component in a simple and effective way using the features the CDK offers.

Appendix: RichFaces Components Overview covers a list of all the components of RichFaces with their functionalities.

Who this book is for

This book targets Java Developers who want to enhance their JSF applications by adding AJAX, but without having to use JavaScript. If you want to learn how to use the wide set of AJAX components that you find in the RichFaces framework, this book is for you.

You are expected to have basic knowledge of JSF, but no previous experience with AJAX is necessary.

Conventions

In this book, you will find a number of styles of text that distinguish between different kinds of information. Here are some examples of these styles, and an explanation of their meaning.

Code words in text are shown as follows: "Notice that the myNewSkin.skin.properties file contains the properties of the skin."

A block of code is set as follows:

<jsp:scriptlet> <![CDATA[ Float ratingValue = (Float) component.getAttributes().get("value"); variables.setVariable("ratingValue", ratingValue); ]]> </jsp:scriptlet>

When we wish to draw your attention to a particular part of a code block, the relevant lines or items are set in bold:

<f:resource f:key="org.richfaces.renderkit.html.CustomizeableGradient"> <f:attribute name="valign" value="middle" /> <f:attribute name="gradientHeight" value="22px" /> <f:attribute name="baseColor" skin="myNewProperty" /> <f:attribute name="gradientColor" skin="headerGradientColor" /> </f:resource>

Any command-line input or output is written as follows:

mvn install

New terms and important words are shown in bold. Words that you see on the screen, in menus or dialog boxes for example, appear in the text like this: "clicking the Next button moves you to the next screen".

Note

Warnings or important notes appear in a box like this.

Tip

Tips and tricks appear like this.

Reader feedback

Feedback from our readers is always welcome. Let us know what you think about this book—what you liked or may have disliked. Reader feedback is important for us to develop titles that you really get the most out of.

To send us general feedback, simply send an email to <[email protected]>, and mention the book title via the subject of your message.

If there is a book that you need and would like to see us publish, please send us a note in the SUGGEST A TITLE form on www.packtpub.com or email <[email protected]>.

If there is a topic that you have expertise in and you are interested in either writing or contributing to a book on, see our author guide on www.packtpub.com/authors.

Customer support

Now that you are the proud owner of a Packt book, we have a number of things to help you to get the most from your purchase.

Note

Downloading the example code for the book

Visit http://www.packtpub.com/files/code/6880_Code.zip to directly download the example code

The downloadable files contain instructions on how to use them.

Errata

Although we have taken every care to ensure the accuracy of our content, mistakes do happen. If you find a mistake in one of our books—maybe a mistake in the text or the code—we would be grateful if you would report this to us. By doing so, you can save other readers from frustration, and help us to improve subsequent versions of this book. If you find any errata, please report them by visiting http://www.packtpub.com/support, selecting your book, clicking on the let us know link, and entering the details of your errata. Once your errata are verified, your submission will be accepted and the errata added to any list of existing errata. Any existing errata can be viewed by selecting your title from http://www.packtpub.com/support.

Piracy

Piracy of copyright material on the Internet is an ongoing problem across all media. At Packt, we take the protection of our copyright and licenses very seriously. If you come across any illegal copies of our works, in any form, on the Internet, please provide us with the location address or web site name immediately so that we can pursue a remedy.

Please contact us at <[email protected]> with a link to the suspected pirated material.

We appreciate your help in protecting our authors, and our ability to bring you valuable content.

Questions

You can contact us at <[email protected]> if you are having a problem with any aspect of the book, and we will do our best to address it.

Chapter 1. What is RichFaces?

In this chapter, we are going to learn about the RichFaces project and how it can help us develop better Ajax web applications faster.

First, we'll go through a bit of the story of its birth and growth. Thereafter, we'll learn how it works (in general), which components are inside its framework, and what we can do with them. Finally, we'll explain some advanced techniques and start looking at the CDK (Component Development Kit) with a simple example.

An overview of RichFaces

RichFaces is a very useful open source framework that allows you to add Ajax capability to your JSF application (using the standard JSF components) without the need to write JavaScript code and manage JavaScript compatibility between browsers. It is integrated with the JSF lifecycle and other standard JSF features such as validation, conversion, and resource management.

Moreover, RichFaces offers the very powerful skinnability. This customizes the look and feel of your JSF applications. You can define different color schemes to create your custom skins or use the predefined ones. Also, you can manage the predefined CSS styles (or add your own ones) to change the appearance of UI library components in a simple and consistent way (you can even use XCSS to dynamically customize the CSS styles). The skinnability feature of RichFaces can apply skins to standard HTML elements such as input, select, textarea, fieldset, and so on.

RichFaces provides two sets of component libraries:

Core Ajax: The Core library contains components that are useful to "ajaxize" JSF pages and standard JSF components. It is very simple to define Ajax areas and to invoke Ajax requests in order to update those areas (we'll see how this is done very soon). Also, it provides a component to generate binary resources on the fly (for example, code-generated images, pdf files, csv files, and so on).

UI: The RichFaces UI library is a set of advanced JSF Ajax components used to add rich user interface features to your applications. The components support Ajax out of the box and perfectly integrate with the Core library. Also, they fully support skins and can be completely adapted according to the users' needs.

Another feature included in the RichFaces framework is the ComponentDevelopmentKit (CDK)—the set of tools used for UI library creation that can be used to make new components with built-in Ajax and skinnability support.

Other extras are the Facelets support, the possibility to create components from Java code (with documented API), the JavaScript API of components to interact with them from the client side (if you want to use JavaScript), and last but not least, the very strong community support.

As you can see, RichFaces has a lot of very powerful features that can help you with rich application development. In the following paragraphs, we'll do a short overview of the framework to start understanding all the possibilities you have.

A bit of history

RichFaces comes from the Ajax4Jsf framework. It was created by Alexander Smirnov who joined Exadel in 2005 in order to continue the development. The idea was to put together the "cool" Ajax techniques with the new JavaServer Faces framework.

The first commercial version was released in March 2006 with the name of Exadel VCP. In the same year, it was split into two projects—Ajax4Jsf (open source) and RichFaces (commercial).

Ajax4Jsf provided the Core Ajax framework and the Ajax components to "ajaxize" JSF components in a page (page-wide Ajax support). RichFaces was a commercial JSF Ajax components library.

In March 2007, Exadel and JBoss (a RedHat division) announced a partnership to open the source code of RichFaces, and the two projects were merged into a single open source project called just "RichFaces". It was a good move to solve the version compatibility issues that the two separate projects had.

Nowadays, the project is moving really fast with the help of the community of users involved with the RichFaces team who also decide what the future developments of the framework will be (such as which feature to develop further, which new component to make first, and so on).

For more information, visit the main web site at http://www.jboss.org/jbossrichfaces/), and the user forum at http://jboss.com/index.html?module=bb&op=viewforum&f=261.

The Ajax framework

The RichFaces Ajax framework is a JSF component library that adds page-wide Ajax support to your pages, unlike the traditional and limited component-wide Ajax support. It means that you can use Ajax components to invoke Ajax requests that are automatically synchronized with the JSF component tree, and update single areas without reloading the entire web page. The following image, taken from the JBoss documentation, shows the request processing flow:

It is not different from a standard JSF page, and you don't even need to write JavaScript code by using the RichFaces Ajax components. Inside the page you can define different areas you want to update, after the Ajax request.

The framework architecture is composed of five parts:

Ajax Filter: This is essential to add Ajax capabilities to your JSF application using RichFaces. It manages all the requests (both Ajax and standard JSF), corrects and validates the markup code sent, manages the script and style loading, the resources cache, and so on. You have to register the filter in the web.xml file.Ajax Action Components: They are standard JSF components that you can use in order to send Ajax requests (we'll see them very soon).Ajax Containers: The framework supports the AjaxContainer interface that describes an area ("region") of the page, which should be decoded during an Ajax request. The biggest region is the whole view of a JSF page, but you can define how many regions you want inside the page.Skinnability: This is a very useful part of the framework and adds skinning capability to your application (later, we'll see it in detail).RichFaces JavaScript Engine: It runs on the client browser and manages Ajax requests and responses. It is automatically managed by the framework, so you don't have to use it directly.

You can decide when to use a standard JSF request (with a full reload of the web page) or when to use an Ajax request. In the latter case, only the involved Ajax region is processed, and the Delta Ajax markup is sent back to the client after the filter has parsed and verified it.

The verification is done because the XMLHTTPRequest JavaScript function sends the request in XML format; the markup inside the XML request is not validated or corrected. The XML filter can automatically remove HTML code problems, but it's a good practice to write standards-compliant XHTML and HTML code.

Components of the RichFaces framework share a lot of Ajax attributes, which are very useful to manage the Ajax options that you have.

The following component attributes are very important and you can find them in all the Ajax-enabled components of the RichFaces framework:

reRender: In order to decide which area must be updated after an Ajax request.ajaxRendered: If it is true, the area is updated after every Ajax request (even if it is not in the reRender attribute). limitToList: In order to force the JavaScript Engine to update the areas only in the reRender attribute.

We'll see these attributes in a lot of components of the framework. Therefore, it is useful to know how they work.

Ajax Action Components

As we have said, these components are used to send Ajax requests to the server. Some examples of these components are:

a4j:commandButton: It is the Ajax version of the standard JSF h:commandButton. This produces Ajax requests instead of standard ones and has attributes to manage the Ajax options.a4j:commandLink: The Ajax version of h:commandLink. It works like a4j:commandButton, but renders a link (HTML <a> tag) instead of the input element.a4j:poll: Using this component, you can periodically poll the server for data and update the page using an Ajax request.a5j:push: It simulates push data from the server.a4j:support: The most important Ajax component of the library; attaching it as a child adds Ajax capabilities to standard JSF components.

Ajax Containers

The RichFaces Ajax framework contains specific components that describe Ajax areas and implement the AjaxContainer interface. The main Ajax container is the view root by default; therefore, you don't need to define an Ajax container for the whole page. However, it's very useful to know how to use the a4j:region component to set new Ajax regions and optimize Ajax requests.

Ajax placeholders

A very important concept to keep in mind while developing is that the Ajax framework can't add or delete elements, but can only replace existing elements in the page. So, if you want to append some code you need to use a placeholder.

RichFaces has a component that can be used as a placeholder: a4j:outputPanel.

Inside the a4j:outputPanel component, you can put other components that use the "rendered" attribute to decide if they are visible or not. When you want to re-render all the included components, just re-render the output panel, and all will work without a problem.

Ajax validators

Another feature of the Ajax framework is the Ajax validators. They work with the JSF validation system. However, as it is event based you can use it to trigger the validation while you are typing, or when you move to another field, and so on. You can mix standard and custom validation and also use the Hibernate Validator framework (so you can just annotate the entire properties to add new validators).

RichFaces components overview

The RichFaces framework contains many JSF components to add Ajax to our applications in a very simple way, without needing to know anything about JavaScript (but if you know it, you have more features to use the framework inside your personalized JS code).

There are a lot of components for different kinds of tasks (such as interaction, input, output, drag-and-drop, validation, and so on). We are going to explain how they work every time we use them in the forthcoming chapters.

Throughout the book, we are going to develop an application using RichFaces. While doing so, we'll see how those components work in practice using real examples that cover all of their functionalities.

RichFaces skinnability overview

In standard CSS, you can't define a particular value (for example, a color or a font size) to "reuse" it in more than one selector—you have to copy and paste it where you need it.

So, if you have to change it, you have to search for the value and manually replace it every time it occurs. As you can figure out, this is an error-prone process that can bring lot of problems and layout inconsistencies.

Moreover, if you need an interface that supports multiple sets of color and must be adjusted on the fly , you have to work with a lot of CSS files having the same declarations but different colors, and you would also have to maintain them for other updates.

The RichFaces skinnability feature is here to help us; it's not a CSS replacement, but integrates it by adding more capabilities.

Summary

In this chapter, we've learnt what the aims of the RichFaces framework are, what are its components (the Ajax framework, the RichFaces components, and skinnability), and what you can do by using it in a web application.

In the next chapter, we will learn how to use those components while developing a real Ajax application. We are also going to learn the most useful programming pattern and optimization techniques, in order to use this framework at its best for our Ajax web applications.

Chapter 2. Getting Ready

In this chapter, we are going to set up and understand our project in order to get ready to develop an application using the RichFaces framework.

We'll explain how to create a project (both automatically and manually) and the IntegratedDevelopmentEnvironments (IDEs) that you can use to boost your productivity during the development.

We are going to talk a little about other technologies such as JBoss Seam and Facelets. You don't have to know them to understand this book, but we suggest you to learn them as they really can boost your productivity.

Creating a RichFaces JSF project the simple way

Obviously, we can create the project from scratch using our preferred IDE, but it is a boring and long task, as you have to set a lot of configuration files and check all the library dependencies. The most convenient method of creating a new project is to use an IDE that supports it (for example, Eclipse with the JBoss tools plugin) or use a tool such as seam-gen.

In real life, you would use RichFaces together with other technologies such as JBoss Seam, Facelets, JPA, and so on. The task of creating a complete and ready-to-run project (for different IDEs) is done very well by this tool, which is included in the JBoss Seam distribution.

Of course, we can just configure everything manually (and we'll see how later in the chapter), but for 90% of "real" projects, this is a good starting point, which means you will save a lot of time.

Seam-gen

We strongly recommend the use of seam-gen for your first project creation. By using it, you will be able to create "in seconds" a new project, which is ready to deploy and to be opened using the Eclipse, IntelliJ Idea, and NetBeans IDEs!

Seam-gen generates an ANT build script, common configuration files, and a basic structure with Facelets templating support.

Moreover, it can automatically generate the JPA entities from a database using the Hibernate hbm2java tool and a simple CRUD (Create, Read, Update, Delete) application (using a Ruby on Rails approach), although we don't want that at this time.

Seam-gen uses RichFaces as the default component library (both seam-gen and Richfaces are JBoss projects) and automatically configures it into the project. We are going to use it to have a fast start and concentrate on the RichFaces features.

The project we are going to develop has support for EJB, JPA, JSF (of course!), Facelets, JBoss Seam, and RichFaces. All of the libraries are put into the lib directory of the generated project, and you can update them by just overwriting them (see the Update RichFaces libraries in a seam-gen generated project section).

Download and install seam-gen

Seam-gen is a command-line tool and is very simple to use. First, let's download and install it in the following way:

Go to http://seamframework.org/Download and download the latest version of JBoss Seam (now Version 2.2)Decompress the zip (or tar.gz) package into your local drive

That's it; as you can see, it is not a real install, because seam-gen is included in the JBoss Seam distribution package.

Generating a project using seam-gen

Creating a project with seam-gen is quite simple. Just open the terminal window, navigate inside the JBoss Seam folder where you have decompressed the package, and launch the following command if you're using Microsoft Windows:

seam setup

If you are using a Unix-like system such as GNU/Linux or Mac OS X, enter the following command:

./seam setup

Seam-gen will ask some questions, which you will have to answer. Be sure to say no when it asks if you want to use ICEFaces instead of RichFaces (no is the default answer), and yes to the question "Are you working with tables that already exist in the database?", if you want to generate the entities from an existing database.

In the next chapter, we will develop an example starting from a seam-gen project, and we will see the meaning of every question.

When the setup is complete, you can call seam-gen again to create the project with the following command, if you are using Microsoft Windows:

seam create-project

If you are using a Unix-like system, such as GNU/Linux or Mac OS X, use the following command:

./seam create-project

This command creates an empty project with all the things we need in order to start coding.

To generate the JPA entities, you can enter the following command if you are using Microsoft Windows:

seam generate-model

If you are using a Unix-like system, use the following command:

/seam generate-model

You can use other commands in order to generate a CRUD application, new actions, forms, and so on. For a complete list of commands, type the following command if you are using Microsoft Windows:

seam help

If you are using a Unix-like system, use the following command:

./seam help

For more information about seam-gen, you can also consult the official documentation for JBoss Seam at http://docs.jboss.org/seam/2.2.0.GA/reference/en-US/html/gettingstarted.html

The seam-gen generated projects can be opened using your preferred IDE (or if you use Eclipse, you can import them into your workspace), and are ready to be edited in order to implement new features.

Update RichFaces libraries in a seam-gen generated project