JavaServer Faces framework 2001 Craig McClanahan is presented that created Struts web framework and based on experience gathered designed JavaServer Faces framework JavaServer Faces2 3 Component-oriented web frameworks JavaServer Faces4 How HTML form data are retrieved in a servlet public void doGet (HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {... String age = request.getParameter(age); String date = request.getParameter(date);... Most data must then be: converted String must be converted to Date, age must be converted to number validated age must be positive number JavaServer Faces5 We declaratively define what form field must be bind with what class field Web framework: moves data through the binding automatically performs conversion and validation JavaServer Faces6 Approach taken by modern UI frameworks: data binding Backing Beans, JavaBeans spec. Class User shown above is called Backing Bean It is non-visual component (do not confuse with JSF components!) Bean (i.e. component) because it must satisfy JavaBeans specification requirements JavaBeans specification available at: html html 114 pages Introduction says: "The goal of the JavaBeans APIs is to define a software component model for Java, so that third party ISVs can create and ship Java components that can be composed together into applications by end users." JavaServer Faces7 Shortly about JavaBeans specification Essential JavaBean components parts: Properties read/write, read-only, write-only properties, property introspection, and so on. Methods Usual public Java class methods; means for communication between JavaBean components Constructor without parameters is required (may be empty though)! JavaBean components have their own binary format JAR archives with manifest file JavaServer Faces8 Example of a property public class Person { private String name; public String getName() { return name; } public void setName(String name) { this.name = name; }... } Property name is tuple {name, getName(), setName()} Without setName() we would get read-only property Without getName() we would get write-only property JavaServer Faces9 Bindings in JSF HTML form fields can be bound to JSF backing bean properties HTML form active components (e.g. buttons, links) can be bound to JSF backing bean methods JavaServer Faces10 Example of an JSF application Application consists from two HTML pages The first page allows to enter a number, and as a result outputs squared number Example of declarative validation is shown The second page shows the last calculated result Example of user session and declarative navigation JavaServer Faces11 A backing beanpublic class Calculator implements Serializable { // Read/write property "number": private int number = 5; public int getNumber() { return number; } public void setNumber(int number) { this.number = number; } // Read-only property "result": private Integer result = null; public Integer getResult() { return result; } // Method to square a number public void square() { result = number * number; } // Method to navigate to the second page public String bye() { return "enough"; } } JavaServer Faces12 The first HTML page index.xhtml JSF calculator JSF calculator JavaServer Faces13 The first HTML page index.xhtml Result: #{calculator.result} JavaServer Faces14 The second HTML page bye.xhtml The last result Bye bye The last result: #{calculator.result} JavaServer Faces15 Declarative navigation: faces-config.xml /index.xhtml enough /bye.xhtml JavaServer Faces16 JSF request processing phases JavaServer Faces17 JSF request processing phases 1. Restore view UI component tree gets restored/created on the server side 2. Apply request values values entered to HTML form fields are being copied to JSF UI components 3. Process validations JSF UI components validate data supplied to them 4. Update model values converted and validated data is being copied from UI components to JSF backing beans 5. Invoke application backing beans method is being invoked 6. Render response renderer traverses through UI component tree and outputs HTML (or other markup) code JavaServer Faces18 Remarks actionListener executes bound backing bean method, does not participate in navigation (application stays on the same page) action executes bound backing bean method, participates in navigation (must return String) immediate="true" if event is marked with this attribute, no converters and validators will be called, model will not be populated with the data from the HTML form JavaServer Faces19 Remarks required="true" does not allow empty value for a form field requiredMessage message shown if required field is left empty converterMessage message shown if conversion is not successful (e.g. String conversion to Integer) validatorMessage message shown if validation is not successful (e.g. number is out of valid range) JavaServer Faces20 Pass-through elements JSF Calculator JSF Calculator Number: Result: #{calculator.result} Square Bye bye JavaServer Faces21 Some JSF concepts Renderer Responsible for displaying a UI component and translating a users input into the component's value. Renderers can be designed to work with one or more UI components, and a UI component can be associated with many different renderers. Validator Responsible for ensuring that the value entered by a user is acceptable. One or more validators can be associated with a single UI component. Backing beans Specialized JavaBeans that collect values from UI components and implement event listener methods. They can also hold references to UI components. Converter Converts a components value to and from a string for display. A UI component can be associated with a single converter. Messages Information thats displayed back to the user. Just about any part of the application (backing beans, validators, converters, and so on) can generate information or error messages that can be displayed back to the user. JavaServer Faces22 JavaServer Faces23 Renderer RenderKit examples Browser Mobile device Telnet JavaServer Faces24 JSF component suites PrimeFaces (http://www.primefaces.org/)http://www.primefaces.org/ RichFaces (http://www.jboss.org/richfaces)http://www.jboss.org/richfaces ICEfaces (http://www.icefaces.org)http://www.icefaces.org OpenFaces (http://openfaces.org)http://openfaces.org TreeTable component example (PrimeFaces): JavaServer Faces25 Whats interesting for an architect JavaServer Faces26