1. Chính phủ điện tử TS. Phạm Văn Tính Khoa CNTT, ĐH Nông Lâm TP.HCM pvtinh@hcmuaf.edu.vn

2. Nội dung 4.Module 4 - Java Server Faces  Giới thiệu về JSF  JSF thông qua ví dụ  Managed Bean  Navigation  Standard JSF Tags  Table  CSS trong JSF  Conversion and Validation  Event handling (Xử lý sự kiện)  AJAX

3. Why Web Apps?  Downsides to browser-based apps  GUI is poor - HTML is OK for static documents, but lousy for programs  Communication is inefficient - HTTP is poor protocol for the way we now use Web apps  So why does everyone want Web apps?  Universal access  Everyone already has a browser installed  Any computer on the network can access content  Automatic “updates”  Content comes from server, so is never out of date

4. What is JSF?  JavaServer Faces technology is a server-side user interface component framework for Java technology- based web applications.  JavaServer Faces bring rapid user-interface development to server-side Java.  think of JSF as "Swing for server-side applications”

5. What is JSF?  A set of Web-based GUI controls and handlers?  JSF provides many prebuilt HTML-oriented GUI controls, along with code to handle their events.  A device-independent GUI control framework?  JSF can be used to generate graphics in formats other than HTML, using protocols other than HTTP.  An MVC-based Web app framework?  Like Apache Struts, JSF can be viewed as an MVC framework for building HTML forms, validating their values, invoking business logic, and displaying results.

6. What is JSF?  An Ajax library?  JSF 2.0 provides very easy-to-use Ajax support. So, JSF 2.0 can be viewed as an alternative to jQuery or GWT.  But which is the proper way to view JSF?  The answer depends on what you are going to use it for, but 1 & 3 are the most common ways of looking at JSF.

7. What is JSF?  Alternatives: traditional Web apps  Servlets/JSP (with MVC)  Struts 2.0  JSF 2.0  Alternatives: Ajax-based Web apps  Add jQuery (or Ext/JS, etc) to existing app  Use the Google Web Toolkit and write everything in Java, following a Swing-like style  Use JSF 2.0 and add Ajax tags to page

8. The History of JavaServer Faces  The Common Gateway Interface  In the mid-1990s, Web application development was still relatively new, and the predominant technology for assembling Web applications used a simple method known as the Common Gateway Interface (CGI) for producing dynamic content.  CGI is a technique that allows a Web page to invoke a server-side process to generate output dynamically, such as for a stock quote or reporting the number of Web site hits. The program that produced the dynamic output was usually an operating system (OS) shell script, a natively compiled program, or an interpreted language such as Perl

9. The History of JavaServer Faces  The Servlet API  The next step forward in the evolution of Web application development was the introduction of the Java Servlet API in March 1998. Prior to servlets, Java was not widely utilized as a server-side technology for Web applications. Instead Java was mainly used in Web pages in the form of Java Applets that would run on browser clients.  The Java Servlet API enabled Java developers to write server-side code for delivering dynamic Web content.

10. The History of JavaServer Faces  JavaServer Pages  The next evolution in Java Web development came with the introduction of JavaServer Pages (JSP). JSP was built on top of servlets and provided a simpler, page-based solution to generating large amounts of dynamic HTML content for Web user interfaces.  JSP provided an improvement but was not a complete solution. As Web applications became more complex, JSP pages often tended to get cluttered with Java code, making them harder to manage and more error prone. What was needed was a better separation of Java application code from the presentation markup. What was needed was MVC.

11. The History of JavaServer Faces  Apache Struts  One of the most dominant server-side Java frameworks to emerge in the last few years was the Jakarta Struts Web applicat  Struts’ popularity is largely due to its implementation of the Model-View-Controller (MVC) design paradigm described by Trygve Reenskaug in Smalltalk in 1979  Struts still often required a substantial amount of custom development for building user interfaces. Even when coupled with the usage of JSTL tags, user interface development with Struts could still be fairly complicated and was really not on a par with what was available with other proprietary technologies such as Microsoft’s ASP.NET, where the user interface development experience is more componentbased and usually less complex

12. The History of JavaServer Faces  The Spring Framework and Spring MVC  Shortly after Struts had become the de facto standard web framework, but during the development of JSF 1.0, Rod Johnson invented the Spring Framework as an alternative programming model to J2EE. The most important innovations delivered by Spring were “Inversion of Control” and the accompanying concept of informal contract programming. These innovations became popular because they allow a very clean separation of business logic from application logic without imposing any compile- time constraints on the business logic code  In practice, Spring is often used with Struts, though Spring includes its own simply MVC framework called Spring MVC

13. The History of JavaServer Faces  The Birth of JavaServer Faces  As Struts gained in popularity, the Java Community Process saw the benefits that Struts offered by explicitly following an MVC approach. However, Struts still lacked a robust user-interface-oriented framework similar to what is possible in other technologies, including traditional Java client technologies such as Swing  To address this need, several leading software vendors, including Sun, Oracle, IBM, and BEA, met through the Java Community Process in May 2001 and voted to proceed with a comprehensive and detailed specification for building Java EE thin-client Web applications whose primary goal was to provide a standard and much simpler way to build user interfaces for Java Web applications.

14. The History of JavaServer Faces  The Birth of JavaServer Faces  This resulted in Java Specification Request (JSR) #127, and JavaServer Faces was born.  JSF combines an MVC design approach with a powerful, component-based UI development framework that greatly simplifies Java EE Web development while using existing markup and servlet technologies. The way this was accomplished is spelled out in the original design goals specified by JSR #127

15. The History of JavaServer Faces  The JavaServer Faces Design Goals 1.Create a standard UI component framework that can be leveraged by development tools to make it easier for tool users to both create high-quality UIs and manage the UI’s connections to application behavior. 2.Define a set of simple, lightweight Java base classes for UI components, component state, and input events. These classes will address UI lifecycle issues, notably managing a component’s persistent state for the lifetime of its page. 3.Provide a set of common UI components, including the standard HTML form input elements. These components will be derived from the simple set of base classes (outlined in #1) that can be used to define new components.

16. The History of JavaServer Faces  The JavaServer Faces Design Goals 4.Provide a JavaBeans model for dispatching events from client-side UI controls to server-side application behavior. 5.5. Define APIs for input validation, including support for client-side validation. 6.6. Specify a model for internationalization and localization of the UI. 7.7. Provide for automatic generation of appropriate output for the target client, takinginto account all available client configuration data, such as the browser version. 8.8. Provide for automatic generation of output containing required hooks for supporting accessibility, as defined by the Web Accessibility Initiative (WAI).

17. JSF Version  JSF 1.0 (11 mar 2004) - Initial release of JSF specification  JSF 1.1 (27 may 2004) - Bug fix release. No specification changes. No HTML renderkit changes.  JSF 1.2 (11 may 2006) - new features and changes.  JSF 2.0 (14 March 2011) - Latest release of JSF specification.

18. JSF 2.0  Ease of Development  Portlet Integration  New Features  HTML5 forms  Page Actions  Event system enhancements  Fixes and Enhancements  Multi-field validation  UIData Collection interface

19. Advantages of JSF  Custom GUI controls  JSF provides a set of APIs and associated custom tags to create HTML forms that have complex interfaces  Event handling  JSF makes it easy to designate Java code that is invoked when forms are submitted. The code can respond to particular buttons, changes in particular values, certain user selections, and so on.  Managed beans  JSF uses beans to achieve the separation of presentation and business logic.

20. Advantages of JSF  Expression Language  JSF provides a concise and powerful language for accessing bean properties and collection elements  Form field conversion and validation  builtin capabilities for checking that form values are in the required format and for converting from strings to various other data types.

21. Advantages of JSF  Centralized file-based configuration  Rather than hard-coding information into Java programs, many JSF values are represented in XML or property files. This means that many wholesale changes can be made by editing a single file without modifying or recompiling Java code.  Consistent approach  JSF encourages consistent use of MVC throughout your application  A device-independent GUI control framework  JSF can be used to generate graphics in formats other than HTML using protocols other than HTTP.

22. 22 What Is a JSF Application?  Like any other Java web application, JSF applications run in a servlet container, and typically contain the following:  JavaBeans components containing application- specific functionality and data  Event listeners  Pages, such as JSP pages  Server-side helper classes, such as database access beans

23. 23 What Is a JSF Application?  In addition, a JavaServer Faces application also has  A custom tag library for rendering UI components on a page  A custom tag library for representing event handlers, validators, and other actions  UI components represented as stateful objects on the server  Backing beans, which define properties and functions for UI components  Validators, converters, event listeners, and event handlers  An application configuration resource file for configuring application resources