Login | Register   
LinkedIn
Google+
Twitter
RSS Feed
Download our iPhone app
TODAY'S HEADLINES  |   ARTICLE ARCHIVE  |   FORUMS  |   TIP BANK
Browse DevX
Sign up for e-mail newsletters from DevX


advertisement
 

Mixing JSTL and JSF in Web Applications : Page 2

Even though the JavaServer Pages Standard Tag Library (JSTL) and the newer JavaServer Faces (JSF) technology are very different, they're not totally incompatible. Find out how and when you might want to consider mixing the two to achieve a blend that's smoother than either one alone.


advertisement

WEBINAR: On-Demand

Unleash Your DevOps Strategy by Synchronizing Application and Database Changes REGISTER >

Setting Up the Environment
To develop Web applications using both JSTL and JSF, you need a servlet container, such as Jakarta Tomcat, JSTL tag libraries, and an implementation of JSF. After installing the servlet container, refer to the JSF installation document for details on installing JSTL and JSF. 

Sample Application Design
In the remainder of this article, I'll walk you through the process to design a mortgage calculator that can perform multiple what-if scenarios using different input values for a mortgage loan. As the user creates the scenarios, the application maintains and displays a list, so users can compare the results easily. Users can then select the scenario they like. This simple Web application will consist of three screens, each of which uses JSF and JSTL in varying degrees.

The directory structure for this application's code base looks like Figure 1.

 
Figure 1. Directory Structure: The figure shows where in the directory structure you should place the various files in your application.
To deploy the application to Tomcat, compile all source files into WEB-INF/classes and archive the entire Web directory and its subdirectories into a WAR file. Copy the WAR file into the appropriate Tomcat hot deployment directory.

The operations required to create this application are straightforward

  • Create a screen where users can input and submit the values to create a what-if scenario (see Figure 2).
  • Make the calculations on the server, and display results (see Figure 3).
  • Let users accept one of the scenarios, at which point the application shows the final results (see Figure 4).
 
Figure 2: Main Data Entry Screen: The figure shows the main data entry screen for the sample application.
You'll find the JSP code to display this UI in the file mortgageCalculator.jsp in the sample application download .

This code for this screen uses JSF tags to define the form fields and paint the form. All the tags with a prefix of "h" are JSF tags that represent HTML form elements. All tags with a prefix of "f" represent the core JSF tags. This screen also uses JSF tags for localization. The f:loadBundle tag loads the resource bundle file, Resources.properties, from the mc.bundles package, and then references it using the variable uiBundle in the remainder of the JSP file. The h:panel_grid tag is the JSF tag to define a table. The notation #{uiBundle.principal} causes the page to retrieve a property named principal from the resource bundle. Here's a brief look at how JSF codes an input field tag:

<h:input_text id="Principal" value="#{MortgageLoanAccount.currentScenario. principal}" validator="#{MortgageLoanAccount.currentScenario. validate}"/>

The notation #{MortgageLoanAccount.currentScenario.principal} retrieves the attribute named principal from the currentScenario object contained in a managed bean object called MortgageLoanAccount, on the server. The validator attribute identifies the validator method for this field. Similarly, the line validator="#{MortgageLoanAccount.currentScenario.validate}" identifies the validate method of the currentScenario object contained in the MortgageLoanAccount bean as the method to use to validate the data entered into the principal field.

The following line defines a command button on the form.

<h:command_button id="anotherCalc" action="#{MortgageLoanAccount.createNewScenario}" value="#{uiBundle.anotherButton}" />

The caption displayed on this button comes from a property named anotherButton in the resource bundle. Clicking the button invokes the MortgageLoanAccount bean's createNewScenario method.

The faces-config.xml file required for every JSF application contains the definition for MortgageLoanAccount. At the bottom of that file is this section:



<!-- ========= Business Logic Beans ============ --> <managed-bean> <description> The bean that backs up the mortgageCalculator Web app </description> <managed-bean-name>MortgageLoanAccount </managed-bean-name> <managed-bean-class> mc.MortgageLoanAccount</managed-bean-class> <managed-bean-scope>session</managed-bean-scope> </managed-bean>

The preceding code fragment defines a session object named MortgageLoanAccount of type mc.MortgageLoanAccount (see the file MortgageLoanAccount.java). This is a class that saves the different loan scenarios represented by the class named MortgageLoanScenario.



Comment and Contribute

 

 

 

 

 


(Maximum characters: 1200). You have 1200 characters left.

 

 

Sitemap
Thanks for your registration, follow us on our social networks to keep up-to-date