JSF View Data From Database Table

JSF View Data From Database Table


Posted in : Java Posted on : October 22, 2012 at 12:44 PM Comments : [ 0 ]

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 :

Download Source Code

Go to Topic «PreviousHomeNext»

Your Comment:


Your Name (*) :
Your Email :
Subject (*):
Your Comment (*):
  Reload Image
 
 

 
Tutorial Topics