A Simple JSF Tutorial with PrimeFaces and JSON Object Parsing in Java

In this tutorial, you will see an example of parsing JSON objects containing exchange rates for certain currencies and displaying them on a web page using JSF 2.1 and PrimeFaces 2.2 which is a rich-component framework for JSF adding AJAX and Web 2.0 capabilities to your web application.

What you need for this tutorial

  • Oracle JDK 1.6 or later
  • Netbeans 7.0 or later (if you choose a different IDE, you will need to manually get the necessary libraries and components for this tutorial. See the following section)
  • Tomcat 7

Technologies and libraries used

  • JSF 2.1 (Mojarra 2 libraries a.k.a. jsf-api.jar, jsf-impl.jar, jstl.jar and standard.jar)
  • PrimeFaces 2.2.1
  • JSON (for Java)
  • commons-logging-1.1.1.jar
  • log4j-1.2.16.jar
  • httpcore-4.1.4.jar
  • httpclient-4.1.3.jar

Setting up the Project with JSF 2 and PrimeFaces Support

Launch Netbeans, and then go along the following steps:
Continue reading

Some thoughts on JSF…

Developed through the Java Community Process (JCP) by a group of technology leaders, including Sun Microsystems later acquired by Oracle, Borland, BEA, and IBM, along with a collection of Java and Web experts well known in the industry under JSR – 314, Java Server Faces technology establishes the standard for building server-side user interfaces. With the contributions of the expert group, the JavaServer Faces APIs are being designed so that they can be leveraged by tools that will make web application development even easier.

What is JSF?

JSF LogoJSF is a request-driven MVC web framework based on component-driven UI design model, using XML files called view templates or Facelets views. Requests are processed by the FacesServlet, which loads the appropriate view template, builds a component tree, processes events, and renders the response (typically HTML) to the client. The state of UI components (and some other objects) is saved at the end of each request (called state saving), and restored upon next creation of that view. Several types of state-saving are available, including client-side and server-side state saving. Out of the box, JSF 1.x uses Java Server Pages (JSP) for its display technology, but can also accommodate other technologies (such as XUL and Facelets). JSF 2 uses Facelets by default for this purpose. Facelets is a more efficient, simple, and yet more powerful view description language (VDL).

What’s the difference between JSF and JSP/Servlets?

JSP (Java Server Pages) is a Java view technology running on the server machine which allows you to write template text in (the client side languages like HTML, CSS, JavaScript and so on). JSP supports the so-called tag libraries shortly denoted as taglibs which are backed by pieces of Java code with which you can control the page flow and/or output dynamically (programmatically). A well known taglib is JSTL. JSP also supports the Expression Language which can be used to access back-end data (actually, the attributes which are available in page, request, session and application scopes), mostly in combination with taglibs.

When a JSP is requested for the first time or when the web application starts up, the servlet container will compile it into a servlet, which is a class extending HttpServlet and use it during the lifetime of the web application. In Tomcat, for example, you can find the source code of the generated servlet in the server’s work directory. On a JSP request, the servlet container will execute the compiled JSP class and send the generated output (usually just HTML/CSS/JS) through the web server over the network to the client side which in turn displays it in the web browser.

Continue reading

Create a Blog with JBoss Seam, Hibernate JPA and JSF then Deploy it to Tomcat in the Cloud – Part IV

Seam Tomcat Deployment Tutorial Part 4
In this part of the tutorial we will correct the bugs inherent in version 2.2 of Seam-gen and we will add some code to spice up our blog CMS.

First of all, our PostEdit.seam page is not working at all as it is. We shall fix this:

Fixing the PostEdit.xhtml page

Figure 4.1 - Fixing the PostEdit.xhtml page

Open PostEdit.xhtml from the WebContent folder and find the <rich:tabPanel switchType=”ajax”> block. This is what’s causing the problem, because it has more than one tab – one to have the user select a category from a grid on another page, and the second one for selecting a user, since these two entites have @ManyToOne relationships to the post entity, and Seam-gen can’t handle generating more than one joined object selection user interface item in this version.

I don’t want an external grid for selection of a category anyway, so we will delete the entire <rich:tabPanel> block on this page, and instead make the category selectable from a pop-up menu using a typical JSF selectOneMenu UI component.

After you delete the <rich:tabPanel> go towards the beginning of the page and locate the code block starting with <s:decorate id=”titleField” template=”layout/edit.xhtml”>.
Within that block replace <h:inputTextarea id=”title” cols=”80″ rows=”2″ required=”true” value=”#{postHome.instance.title}”/> with <h:inputText id=”title” required=”true” value=”#{postHome.instance.title}”/>

Next, add the following code block below the closing tag (</s:decorate>) for titleField:

           <s:decorate id="categoryField" template="layout/edit.xhtml">
                <ui:define name="label">Post Category</ui:define>
                <h:selectOneMenu id="category"
                           required="true"
                              value="#{postHome.instance.title}">
                     <s:selectItems value="#{categoryList.resultList}" var="cat" label="#{cat.name}" noSelectionLabel="Please select..." />
                     <s:convertEntity />
                </h:selectOneMenu>
            </s:decorate>

Continue reading

Create a Blog with JBoss Seam, Hibernate JPA and JSF then Deploy it to Tomcat in the Cloud – Part III

Seam Tomcat Deployment

In this part III of the tutorial, we’ll build the entity classes from the database we created in Part I and configure the Seam project we created in Part II so as to make it fully compatible with Apache Tomcat.

Creating The Model Layer

We’ll use Hibernate‘s reverse engineering tool (hbm2java) embedded in Seam-gen to create the entity classes from the database we created in part 1.

Seam Generate Entities

Figure 3.1 - Generating entities from database in JBoss Seam

Right-click the project blog in project explorer and select New > Seam Generate Entities.

Continue reading