Display Data from Database in JSF Application
This Example demonstrates you how to display data
from database in JSF application.
Developing JSF
Application
In this section, we are going to display data from database in JSF based web applications.
The dataTable tag is used to create
table on the page. The component is rendered as an html <table> element.
UIColumn child components are responsible for rendering columns of the table. In
these columns you can put any type of component like input text box, output
text, command button etc.<h:column> tag is used to create column.
There can be many column tags within dataTable tag. You can set header and
footer in this table. For this <f:facet> tag is used. data table
component and its children column component can use header and footer facet.
This section provides you the code to which uses this
tag and some of its attributes. It uses backing bean that supplies data to the
data table to be rendered to the cells of the columns of the table.
Code Description :
1.Create a web page "data.jsp" for display
data.
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<f:view><html>
<head>
</head>
<body>
<center>
<br><br><br>
<h:dataTable id="dt1" value="#{tableBean.perInfoAll}" var="item" bgcolor="#F1F1F1" border="10" cellpadding="5" cellspacing="3" rows="4" width="50%" dir="LTR" frame="hsides" rules="all" summary="This is a JSF code to create dataTable." >
<f:facet name="header">
<h:outputText value="This is 'dataTable' demo" />
</f:facet>
<h:column>
<f:facet name="header">
<h:outputText value="First Name" />
</f:facet>
<h:outputText style="" value="#{item.firstName}" ></h:outputText>
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="Last Name"/>
</f:facet>
<h:outputText value="#{item.lastName}"></h:outputText>
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="Username"/>
</f:facet>
<h:outputText value="#{item.uname}"></h:outputText>
</h:column>
<f:facet name="footer">
<h:outputText value="The End" />
</f:facet>
</h:dataTable><br>
</center>
</body></html></f:view>
|
2. Create a Bean class "TableBean.java".
package roseindia;
import java.sql.*;
import java.util.*;
public class TableBean {
Connection con ;
Statement ps;
ResultSet rs;
private List perInfoAll = new ArrayList();
public List getperInfoAll() {
int i = 0;
try
{
Class.forName("com.mysql.jdbc.Driver");
con = DriverManager.getConnection("jdbc:mysql://localhost:3306/userdetails","root","root");
ps = con.createStatement();
rs = ps.executeQuery("select * from user");
while(rs.next()){
System.out.println(rs.getString(1));
perInfoAll.add(i,new perInfo(rs.getString(1),rs.getString(2),rs.getString(3)));
i++;
}
}
catch (Exception e)
{
System.out.println("Error Data : " + e.getMessage());
}
return perInfoAll;
}
public class perInfo {
String uname;
String firstName;
String lastName;
public perInfo(String firstName,String lastName,String uname) {
this.uname = uname;
this.firstName = firstName;
this.lastName = lastName;
}
public String getUname() {
return uname;
}
public String getFirstName() {
return firstName;
}
public String getLastName() {
return lastName;
}
}
}
|
3. Mapping for Bean class "faces-config.xml".
<?xml version="1.0"?>
<faces-config>
<managed-bean>
<managed-bean-name>tableBean</managed-bean-name>
<managed-bean-class>roseindia.TableBean</managed-bean-class>
<managed-bean-scope>request</managed-bean-scope>
</managed-bean>
</faces-config>
|
4.web.xml
<?xml version="1.0"?>
<!DOCTYPE web-app PUBLIC
"-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
"http://java.sun.com/dtd/web-app_2_3.dtd">
<web-app>
<context-param>
<param-name>javax.faces.STATE_SAVING_METHOD</param-name>
<param-value>server</param-value>
</context-param>
<context-param>
<param-name>javax.faces.CONFIG_FILES</param-name>
<param-value>/WEB-INF/faces-config.xml</param-value>
</context-param>
<listener>
<listener-class>com.sun.faces.config.ConfigureListener</listener-class>
</listener>
<!-- Faces Servlet -->
<servlet>
<servlet-name>Faces Servlet</servlet-name>
<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
<load-on-startup> 1 </load-on-startup>
</servlet>
<!-- Faces Servlet Mapping -->
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>*.jsf</url-pattern>
</servlet-mapping>
</web-app>
|
Output :
Database Table : "user"
Download the application
|
Del.icio.us
Digg
Google
Spurl
Blink
Furl
Simpy
Y! MyWeb
