2160707 Advanced Java Unit5 Java Server Faces Prof
- Slides: 58
2160707 Advanced Java Unit-5 Java Server Faces Prof. Swati R. Sharma swati. sharma@darshan. ac. in
Subject Overview Sr. No. Unit % Weightage 1 Java Networking 5 2 JDBC Programming 10 3 Servlet API and Overview 25 4 Java Server Pages 25 5 Java Server Faces 10 6 Hibernate 15 7 Java Web Frameworks: Spring MVC 10 Reference Book: Black Book “ Java server programming” J 2 EE, 1 st ed. , Dream Tech Publishers, 2008. 3. Kathy walrath ” Chapter 11 Unit-5 Java Server Faces 2 Darshan Institute of Engineering & Technology
Introduction to JSF Java Server Faces Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
What is JSF? § Java Server Faces (JSF) is a MVC web framework. § JSF simplifies the construction of user interfaces (UI) for serverbased applications by using reusable UI components in the page. § The JSF specification defines a set of standard UI components and provides an (API) for developing components. § JSF enables the reuse and extension of the existing standard UI components. Unit-5 Java Server Faces 4 Darshan Institute of Engineering & Technology
Advantages of JSF § Providing reusable UI components § Making easy data transfer between UI components § Managing UI state across multiple server requests § Enabling implementation of custom components § Wiring client side event to server side application code § Good separation of the logic and presentation Unit-5 Java Server Faces 5 Darshan Institute of Engineering & Technology
MVC Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
What is MVC Design Pattern? § MVC design pattern designs an application using three separate modules: Model Carries Data and login View Shows User Interface Controller Handles processing of an application. UI Logic Business Logic Model View Controller Request & Relay data Unit-5 Java Server Faces 7 Darshan Institute of Engineering & Technology
JSF request processing Life cycle Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Request Processing Life Cycle JSF application lifecycle consist of six phases which are as follows: Phase-I: Restore View (RV) Phase-II: Apply Request Values (ARV) Phase-III: Process Validations (PV) Phase-IV: Update Model Values (UMV) Phase-V: Invoke Application (IA) Phase-IV: Render Response (RR) Unit-5 Java Server Faces 9 Darshan Institute of Engineering & Technology
JSF request processing Life cycle Request Response Create or Restore View Apply Request Values Process Validations Render Response Invoke Application Update Model Values 10 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF request processing Life cycle Phase 1: Restore view § JSF begins the restore view phase as soon as a link or a button is clicked and JSF receives a request. § During this phase, the JSF builds the view, wires event handlers and validators to UI components and saves the view in the Faces. Context instance. § The Faces. Context instance will now contains all the information required to process a request. 11 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF request processing Life cycle Request Response Create or Restore View Apply Request Values Process Validations Render Response Invoke Application Update Model Values 12 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF request processing Life cycle Phase 2: Apply request values § In this phase, the values that are entered by the user will be updated on each and every individual component defined in the View graph. § Component stores this value. § If any of the Conversions or the Validations fail, then the current processing is terminated and the control directly goes to the Render Response for rendering the conversion or the validation errors to the Client. 13 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF request processing Life cycle Request Response Create or Restore View Apply Request Values Process Validations Render Response Invoke Application Update Model Values 14 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF request processing Life cycle Phase 3: Process validation § This Phase will process any Validations that are configured for UI Components. § These validations will only happen for the UI Components only if the property 'rendered' property is set to 'true'. 15 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF request processing Life cycle Request Response Create or Restore View Apply Request Values Process Validations Render Response Invoke Application Update Model Values 16 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF request processing Life cycle Phase 4: Update model values § After the JSF checks that the data is valid, it walks over the component tree and set the corresponding server-side object properties to the component’s local values. § The JSF will update the bean properties corresponding to input component's value attribute. 17 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF request processing Life cycle Request Response Create or Restore View Apply Request Values Process Validations Render Response Invoke Application Update Model Values 18 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF request processing Life cycle Phase 5: Invoke application § During this phase, the JSF handles any application-level events, such as submitting a form / linking to another page. § In this phase, JSF Implementation will call UIComponent. Base. process. Applications() the method which will immediately call the Render Response Phase. 19 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF request processing Life cycle Request Response Create or Restore View Apply Request Values Process Validations Render Response Invoke Application Update Model Values 20 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF request processing Life cycle Phase 6: Render response § And finally, we have reached the Render Response whose job is to render the response back the Client Application. 21 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF request processing Life cycle Restore View Apply Request Values Process Validation Update Model Values Invoke Application Render Response Recover the component tree Adds new parameter to recovered component tree Validates the parameter update the bean properties corresponding to input component's value attribute Instances MB(Managed Bean), adds value of component to properties of MB, Method of MB is executed. Add value of the attribute to Component tree, Generates HTML code. 22 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Program § Java Server Faces technology provides an easy and user-friendly process for creating web applications. § Developing a simple Java. Server Faces application typically requires the following tasks: 1. Developing managed beans (. java file) 2. Creating web pages using component tags (. xhtml file) 3. Mapping the javax. faces. webapp. Faces. Servlet instance (web. xml) 23 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Program Developing the Managed Bean 1. package hello; 2. import javax. faces. bean. Managed. Bean; 3. @Managed. Bean 4. public class Hello { 5. String world = "Hello World!"; 6. public String getworld() 7. { 8. return world; 9. } 10. } 24 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Program : index. xhtml Creating the Web Page In a typical Facelets application, web pages are created in XHTML. 1. <? xml version='1. 0' encoding='UTF-8' ? > 2. <html xmlns="http: //www. w 3. org/1999/xhtml" 3. xmlns: h="http: //xmlns. jcp. org/jsf/html"> 4. <head> 5. <title>Facelet Title</title> 6. </head> 7. <h: body> 8. #{hello. world} 9. </h: body> 10. </html> 25 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Program Mapping the Faces Servlet Instance § The final task requires mapping the Faces. Servlet, which is done through the web deployment descriptor (web. xml). 26 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Tags Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Tag Libraries § JSF framework provides a standard HTML tag library. § Each tag will rendered into corresponding html output. § To use these html tags we have to use the following namespaces of URI in html node. <html xmlns="http: //www. w 3. org/1999/xhtml" xmlns: h="http: //java. sun. com/jsf/html"> § Two types of JSF Tag library <%@taglib uri=" http: //java. sun. com/jsf/core" prefix=" f" %> <%@taglib uri=" http: //java. sun. com/jsf/html" prefix=" h" %> 30 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Basic Tags JSF Basic Tag HTML Tag h: input. Text HTML input of type="text" h: input. Secret HTML input of type="password", h: input. Hidden HTML input of type="hidden". h: select. Many Checkbox A group of HTML check boxes h: select. One Listbox Single HTML list box. h: output. Text HTML text. h: command. Button HTML input of type="submit" button. h: Link HTML anchor. h: output. Label HTML Label 31 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSP Basic Tags JSF Basic Tag HTML Tag f: param Parameters for JSF UI Component. f: attribute Attribute for a JSF UI Component. f: set. Property Action. Listener Sets value of a managed bean's property 32 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Program: Basic Tag Index. xhtml 1. <html xmlns="http: //www. w 3. org/1999/xhtml" 2. xmlns: h="http: //java. sun. com/jsf/html" 3. xmlns: f="http: //xmlns. jcp. org/jsf/core"> 4. <h: body> 5. 6. <h: form> <h 3>JSF Login Logout</h 3> 7. <h: output. Text value="Username: " /> 8. <h: input. Text id="username" value=""></h: input. Text> <h: output. Text value="Password: " /> 9. <h: input. Secret id="password" value="" /> 10. <h: command. Button action="/index. xhtml" value="Login"></h: command. Button> 33 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Program: Basic Tag 11. <h: select. Many. Checkbox value=""> 12. <f: select. Item item. Value="1" item. Label="Diet J 2 SE" /> 13. <f: select. Item item. Value="2" item. Label="Diet J 2 EE" /> 14. </h: select. Many. Checkbox> 15. <h: select. One. Radio value=""> 16. <f: select. Item item. Value="1" item. Label="Sem 4" /> 17. <f: select. Item item. Value="2" item. Label="Sem 6" /> 18. </h: select. One. Radio> 34 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Program: Basic Tag 19. <h: select. One. Listbox value=""> 20. <f: select. Item item. Value="1" item. Label="List 1" /> 21. <f: select. Item item. Value="2" item. Label="List 2" /> 22. <f: select. Item item. Value="2" item. Label="List 3" /> 23. <f: select. Item item. Value="2" item. Label="List 4" /> 24. </h: select. One. Listbox> 25. <h: graphic. Image value= "http: //www. darshan. ac. in/Upload/DIET/Brochure/2016/D IET_Placement_Brochure_CE_2016. jpg"/> 26. 27. </h: form> </h: body> 28. </html> 35 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Facelet Tags § A viewhandler purely created for JSF § No more JSP §. xhtml instead of. jsp § No tld files and no tag classes to defined a UIComponent. § Faster than using JSP. 36 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Facelet Tags § JSF provides special tags to create common layout for a web application tags. § These tags gives flexibility to manage common parts of a multiple pages at one place. Templates ui: insert Inserts content into a template. That content is define with the ui: define tag ui: define The define tag defines content that is inserted into a page by a template. ui: composition The <ui: composition> tag provides a template encapsulating the content to be included in the other facelet. ui: include This tag includes the component in the src attribute as a part of the current JSF page. 37 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Convertor Tags § JSF has convertors to convert its UI component's data to object used in a managed bean and vice versa. § For example, we can convert a text into date object and can validate the format of input as well. f: convert. Number Converts a String into a Number of desired format f: convert. Date. Time Converts a String into a Date of desired format Custom Convertor Creating a custom convertor 38 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Validator Tags § JSF has built in validators to validate its UI components. f: validate. Length Validates length of a string f: validate. Long. Range Validates range of numeric value f: validate. Double. Range Validates range of float value f: validate. Regex Validate JSF component with a given regular expression. Custom Validator Creating a custom validator 39 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Expression Language § JSF provides a rich expression language. § Notation: #{operation-expression} § Example #{i=10} <!-- output: 10 --> #{10 > 9} <!-- output: true--> #{user. Car. add} <!– calls add() of User. Car bean -> 40 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Program: Login. Bean. java 1. import javax. faces. bean. Managed. Bean; 2. @Managed. Bean 3. public class Login. Bean { 4. String username; 5. String password; 6. public String get. Username() {return username; } 7. public void set. Username(String username) { 8. this. username = username; } 9. public String get. Password() {return password; } 10. public void set. Password(String password) { 11. this. password = password; } 12. public String login() { 13. if(username. equals("java") && password. equals("jsf")) 14. return "success"; 15. else{return "failure"; } }} 41 Darshan Institute of Engineering & Technology Unit-5 Java Server Faces
JSF Program: index. xhtml 1. <html xmlns="http: //www. w 3. org/1999/xhtml" 2. xmlns: c="http: //java. sun. com/jsf/core" 3. xmlns: ui="http: //java. sun. com/jsf/facelets" 4. xmlns: h="http: //java. sun. com/jsf/html"> 5. <h: body> 6. <h: form id="login. Form"> 7. <h: output. Label value="username" /> 8. <h: input. Text value="#{login. Bean. username}" /> 9. <h: output. Label value="password" /> 10. <h: input. Secret value="#{login. Bean. password}"></h: input. Secret> 11. <h: command. Button value="Login" action="#{login. Bean. login}"></h: command. Button> 12. </h: form> 13. </h: body></html> 42 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
Output 43 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Event Handling § When a user clicks a JSF button or link or changes any value in text field, JSF UI component fires event which will be handled by the application code. § To handle such event, event handler are to be registered in the application code or managed bean. § When a UI component checks that a user event has happened, it creates an instance of the corresponding event class and adds it to an event list. 44 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Event Handling Event Handlers Description value. Change. Listener Value change events get fired when user make changes in input components. action. Listener Action events get fired when user clicks on a button or link component. Application Events firing during JSF lifecycle: Post. Construct. Application. Event, Pre. Destroy. Application. Event , Pre. Render. View. Event. 45 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Database ACCESS § We can easily integrate JDBC with JSF for Database Access, let’s understand with an example. § Files required for JSF DB access are as follows: 1. Authentication. Bean. java 2. index. xhtml 3. success. xhtml 4. fail. xhtml 5. Faces-config. xml [Navigational file] 46 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Database ACCESS Authentication. Bean. java 1. import java. sql. *; 2. import javax. faces. bean. Managed. Bean; 3. import javax. faces. bean. Request. Scoped; 4. @Managed. Bean 5. @Request. Scoped 6. public class Authentication. Bean { 7. String uname; 8. String password; 9. public String get. Uname() 10. {return uname; } 11. public String get. Password() 12. {return password; } 13. public void set. Uname(String uname) 14. {this. uname = uname; } 15. public void set. Password(String password) 16. {this. password = password; } 47 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Database ACCESS Authentication. Bean. java 17. // This method will perform authentication from database 18. public String validate. From. DB()throws Exception{ 19. int i=0; 20. if(uname. equals("diet") && password. equals("diet") ){ 21. Class. for. Name("com. mysql. jdbc. Driver"); 22. Connection con= Driver. Manager. get. Connection ("jdbc: mysql: //localhost: 3306/ajava", "root"); 23. Statement st=con. create. Statement(); 24. i=st. execute. Update("insert into cxcy values(2011, 'dfg', 'r 1')"); 25. } 26. if(i!=0) 27. {return "success"; } 28. else {return "failure"; } 29. }} 48 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Database ACCESS index. xhtml 1. <? xml version='1. 0' encoding='UTF-8' ? > 2. <!DOCTYPE html PUBLIC "-//W 3 C//DTD XHTML 1. 0 Transitional//EN" "http: //www. w 3. org/TR/xhtml 1/DTD/xhtml 1 -transitional. dtd"> 3. <html xmlns="http: //www. w 3. org/1999/xhtml" 4. xmlns: h="http: //java. sun. com/jsf/html"> 5. <h: body><h: form><center> 6. Enter Name : <h: input. Text id="name" value="#{authentication. Bean. uname}" ></h: input. Text> 7. Enter Password <h: input. Secret id="pwd" 8. value="#{authentication. Bean. password}"/> 9. <h: command. Button value="Submit" 10. action="#{authentication. Bean. validate. From. DB}"/> 11. </center></h: form></h: body></html> 49 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Database ACCESS success. xhtml 1. <? xml version='1. 0' encoding='UTF-8' ? > 2. <!DOCTYPE html PUBLIC "-//W 3 C//DTD XHTML 1. 0 Transitional//EN" 3. "http: //www. w 3. org/TR/xhtml 1/DTD/xhtml 1 transitional. dtd"> 4. <html xmlns="http: //www. w 3. org/1999/xhtml" 5. xmlns: h="http: //java. sun. com/jsf/html"> 6. <h: head> 7. <title>Welcome</title> 8. </h: head> 9. <h: body> 10. Welcome Home: query executed 11. </h: body> 12. </html> 50 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Database ACCESS fail. xhtml 1. <? xml version='1. 0' encoding='UTF-8' ? > 2. <!DOCTYPE html PUBLIC "-//W 3 C//DTD XHTML 1. 0 Transitional//EN" 3. "http: //www. w 3. org/TR/xhtml 1/DTD/xhtml 1 transitional. dtd"> 4. <html xmlns="http: //www. w 3. org/1999/xhtml" 5. xmlns: h="http: //java. sun. com/jsf/html"> 6. <h: head> 7. <title>login failed</title> 8. </h: head> 9. <h: body> 10. Login Failed 11. </h: body> 12. </html> 51 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Database ACCESS Faces-config. xml 1. <? xml version='1. 0' encoding='UTF-8'? > 2. <faces-config version="2. 1" 3. xmlns="http: //java. sun. com/xml/ns/javaee" 4. xmlns: xsi="http: //www. w 3. org/2001/XMLSchema-instance" 5. xsi: schema. Location="http: //java. sun. com/xml/ns/javaee/webfacesconfig_2_1. xsd"> 6. <navigation-rule> 7. <from-view-id>/index. xhtml</from-view-id> 52 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Database ACCESS Faces-config. xml 8. <navigation-case> 9. <from-action> #{authentication. Bean. validate. From. DB}</from-action> 10. <from-outcome>success</from-outcome> 11. <to-view-id>/success. xhtml</to-view-id> 12. </navigation-case> 13. <navigation-case> 14. <from-action> #{authentication. Bean. validate. From. DB}</from-action> 15. <from-outcome>failure</from-outcome> 16. <to-view-id>/fail. xhtml</to-view-id> 17. </navigation-case> 18. </navigation-rule> 19. </faces-config> 53 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Database ACCESS: output 54 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
JSF Libraries: Prime. Faces § Prime. Faces is a lightweight library with one jar, zero-configuration and no required dependencies § To use JSF prime faces library we need to use following code: § <html xmlns="http: //www. w 3. org/1999/xhtml" xmlns: p="http: //primefaces. org/ui "> 55 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
Introduction to Prime. Faces Simplicity and Performance § Prime. Faces is a lightweight library, all decisions made are based on keeping Prime. Faces as lightweight as possible. § Usually adding a third-party solution could bring a overhead however this is not the case with Prime. Faces. § It is just one single jar with no dependencies and nothing to configure. 56 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
Introduction to Prime. Faces Ease of Use § Components in Prime. Faces are developed with a design principle which states that "A good UI component should hide complexity but keep the flexibility" 57 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
Introduction to Prime. Faces Strong Community Feedback § Prime. Faces community continuously helps the development of Prime. Faces by providing feedback, new ideas, bug reports and patches. 58 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
Prime. Faces Tags JSF prime faces provides following collection of tags: 1. <p: input. Text> 2. <p: input. Secret> 3. <p: command. Button> 4. <p: command. Link> 5. <p: ajax> 6. <p: bar. Chart> 7. <p: calendar> 8. <p: color. Picker> 9. <p: dialog> 10. <p: file. Upload> 11. <p: file. Download> 59 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
GTU Questions 1. Draw the JSF request processing life cycle and briefly give the function of each phase. 2. Write a short note on JSF Facelets. 3. List the JSF validation tags and explain any two. 60 Unit-5 Java Server Faces Darshan Institute of Engineering & Technology
- 6 rectangular faces and 8 vertices
- Jsf lifecycle
- Azure secure enclave
- 2232021
- Advanced data structures in java
- Java object oriented exercises
- Advanced programming in java
- Java server pages tutorial
- Java telegram bot
- Java irc server
- Java client server tutorial
- Java.rmi.server.codebase
- Lập trình socket giao tiếp tcp client/server java
- Knock knock server java
- Jsf sample
- Java server pages
- Java server pages
- Servlet
- Import java.util.*
- Import java.util.*
- Swing vs awt
- Import util scanner
- Java
- Java gcd
- Import java util random
- Import java.io.*
- Import java util
- Java import java.io.*
- Awt adalah
- Import java.awt.event
- Java compiler translates java source code into
- Rmi vs ejb
- Polyhedron shapes
- Smiling faces beautiful places
- Faces in rectangular pyramid
- Mask of many faces
- Soccss
- Cube has how many edges and vertices
- Great faces great places
- Figuras retangulares
- Changing faces skin camouflage
- Many faces do you see
- Retirando ao acaso uma carta de um baralho comum
- How many planes of symmetry does a prism have
- Many faces do you see
- The pointed end of a blood stain always faces
- Poliedro com 5 faces 6 vertices e 9 arestas
- How many faces
- In once upon a time who wears many faces like dresses
- Revolutions sweep europe
- Faces moedas euro
- How much would it cost
- Exercícios de prisma hexagonal
- Quantas faces tem uma pirâmide
- 6 flat surfaces and 8 vertices
- Hexagonal pyramid faces
- Planificação retangulo
- Young five faces of oppression
- Tetrahedron faces edges vertices