In this tutorial we will learn about how to view data of a database table.
JSF View Data From Database Table
In this tutorial we will learn about how to view data of a database table.
In this section I have tried to create an example for showing the data of a database table. For this I have created a table into the database named 'user1' as follows :
CREATE TABLE `user1` ( `userId` bigint(10) NOT NULL, `name` varchar(15) NOT NULL, `address` varchar(255) NOT NULL, `created_date` date NOT NULL, PRIMARY KEY (`userId`) ) ENGINE=InnoDB DEFAULT CHARSET=latin1 CHECKSUM=1 ROW_FORMAT=DYNAMIC
And Inserted some data into the 'user1' table as follows :
INSERT INTO user1(userId, name, address, created_date) VALUES(1,'Deepak','Delhi','2012-10-14') INSERT INTO user1(userId, name, address, created_date) VALUES(2,'Sandeep','Delhi','2012-10-15') INSERT INTO user1(userId, name, address, created_date) VALUES(3,'Rajesh','Mumbai','2012-10-16') INSERT INTO user1(userId, name, address, created_date) VALUES(4,'Chitrasen','Chennai','2012-10-17') INSERT INTO user1(userId, name, address, created_date) VALUES(5,'Ankit','Kolkata','2012-10-18')
And the database table 'user1' is look like as follows :
Now its time to make a program in JSF to show the data of a database table. For this I have created the two Java files named User.java and UserBean.java. In User.java file there are some data members and their setter getter methods. And in the UserBean.java file I have created a method which returns a list that contained the user records. Within this method I have written the code for connecting to database and the query to search the data of database table. Then created an XHTML page named index.html where I have used the <h:dataTable> tag of JSF HTML tag library to show the data into a table.
Directory Structure
Sample Codes are being given here:
User.java
package com.dev.user.model; import javax.faces.bean.ManagedBean; import javax.faces.bean.RequestScoped; import java.util.Date; @ManagedBean(name="user") @RequestScoped public class User { private long userID; private String name; private String address; private Date created_date; public long getUserID() { return userID; } public void setUserID(long userID) { this.userID = userID; } public String getName() { return name; } public void setName(String name) { this.name = name; } public String getAddress() { return address; } public void setAddress(String address) { this.address = address; } public Date getCreated_date() { return created_date; } public void setCreated_date(Date created_date) { this.created_date = created_date; } }
UserBean.java
package com.dev; import java.sql.Connection; import java.sql.DriverManager; import java.sql.PreparedStatement; import java.sql.ResultSet; import java.util.ArrayList; import java.util.List; import javax.faces.bean.ManagedBean; import javax.faces.bean.SessionScoped; import com.dev.user.model.User; @ManagedBean(name = "userBean") @SessionScoped public class UserBean { public List<User> getUserList() { List<User> list = new ArrayList<User>(); PreparedStatement ps = null; Connection con = null; ResultSet rs = null; try { Class.forName("com.mysql.jdbc.Driver"); con = DriverManager.getConnection("jdbc:mysql://localhost:3306/record", "root", "root"); String sql = "select * from user1"; ps= con.prepareStatement(sql); rs= ps.executeQuery(); while (rs.next()) { User usr = new User(); usr.setUserID(rs.getLong("userId")); usr.setName(rs.getString("name")); usr.setAddress(rs.getString("address")); usr.setCreated_date(rs.getDate("created_date")); list.add(usr); } } catch(Exception e) { e.printStackTrace(); } finally { try { con.close(); ps.close(); } catch(Exception e) { e.printStackTrace(); } } return list; } }
index.xhtml
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" > <h:head> <title>index.xhtml</title> </h:head> <h:body> <h1>JSF 2.0 View Data From The Database Table Example</h1> <h:dataTable value="#{userBean.getUserList()}" var="u" border="1"> <h:column> <f:facet name="header"> User ID </f:facet> #{u.userID} </h:column> <h:column> <f:facet name="header"> Name </f:facet> #{u.name} </h:column> <h:column> <f:facet name="header"> Address </f:facet> #{u.address} </h:column> <h:column> <f:facet name="header"> Created Date </f:facet> #{u.created_date} </h:column> </h:dataTable> </h:body> </html>
web.xml
<?xml version="1.0" encoding="UTF-8"?> <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0"> <display-name>jsfJdbcView</display-name> <welcome-file-list> <welcome-file>index.xhtml</welcome-file> </welcome-file-list> <servlet> <servlet-name>Faces Servlet</servlet-name> <servlet-class>javax.faces.webapp.FacesServlet</servlet-class> <load-on-startup>1</load-on-startup> </servlet> <servlet-mapping> <servlet-name>Faces Servlet</servlet-name> <url-pattern>/faces/*</url-pattern> <url-pattern>*.jsf</url-pattern> <url-pattern>*.xhtml</url-pattern> <url-pattern>*.jsp</url-pattern> </servlet-mapping> <context-param> <description>State saving method: 'client' or 'server' (=default). See JSF Specification 2.5.2</description> <param-name>javax.faces.STATE_SAVING_METHOD</param-name> <param-value>client</param-value> </context-param> <context-param> <param-name>javax.servlet.jsp.jstl.fmt.localizationContext</param-name> <param-value>resources.application</param-value> </context-param> <listener> <listener-class>com.sun.faces.config.ConfigureListener</listener-class> </listener> <servlet-mapping> <servlet-name>Faces Servlet</servlet-name> <url-pattern>*.faces</url-pattern> </servlet-mapping> </web-app>
Output
When you will execute the above code you will get the output as follows :
[ 0 ] Comments