How to use <h:dataTable> JSF component


Use the following 2 classes to generate the content for h:dataTable  JSF UI component

package content;

/**
*
* @author tunatore
*/
public class Employee {

private int employeeID;
private String employeeName;
private String employeeSurname;
private String employeePhoneNumber;

/**
* @return the employeeID
*/
public int getEmployeeID() {
return employeeID;
}

/**
* @param employeeID the employeeID to set
*/
public void setEmployeeID(int employeeID) {
this.employeeID = employeeID;
}

/**
* @return the employeeName
*/
public String getEmployeeName() {
return employeeName;
}

/**
* @param employeeName the employeeName to set
*/
public void setEmployeeName(String employeeName) {
this.employeeName = employeeName;
}

/**
* @return the employeeSurname
*/
public String getEmployeeSurname() {
return employeeSurname;
}

/**
* @param employeeSurname the employeeSurname to set
*/
public void setEmployeeSurname(String employeeSurname) {
this.employeeSurname = employeeSurname;
}

/**
* @return the employeePhoneNumber
*/
public String getEmployeePhoneNumber() {
return employeePhoneNumber;
}

/**
* @param employeePhoneNumber the employeePhoneNumber to set
*/
public void setEmployeePhoneNumber(String employeePhoneNumber) {
this.employeePhoneNumber = employeePhoneNumber;
}

}
package content;

import java.util.ArrayList;
import java.util.List;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;

/**
*
* @author tunatore
*/
@ManagedBean(name = "EmployeeGenerator")
@RequestScoped
public class EmployeeGenerator {

private List<Employee> employees = new ArrayList<Employee>();

public EmployeeGenerator() {

Employee e1 = new Employee();
e1.setEmployeeID(1);
e1.setEmployeeName("Tuna");
e1.setEmployeeSurname("Tore");
e1.setEmployeePhoneNumber("12345678");

Employee e2 = new Employee();
e2.setEmployeeID(2);
e2.setEmployeeName("James");
e2.setEmployeeSurname("Gosling");
e2.setEmployeePhoneNumber("2222222222");

Employee e3 = new Employee();
e3.setEmployeeID(3);
e3.setEmployeeName("Linus");
e3.setEmployeeSurname("Torvalds");
e3.setEmployeePhoneNumber("3333333333");

Employee e4 = new Employee();
e4.setEmployeeID(4);
e4.setEmployeeName("Bill");
e4.setEmployeeSurname("Gates");
e4.setEmployeePhoneNumber("44444444");

Employee e5 = new Employee();
e5.setEmployeeID(5);
e5.setEmployeeName("Larry");
e5.setEmployeeSurname("Ellison");
e5.setEmployeePhoneNumber("555555555");

Employee e6 = new Employee();
e6.setEmployeeID(6);
e6.setEmployeeName("Tim");
e6.setEmployeeSurname("Berners-Lee");
e6.setEmployeePhoneNumber("66666666");

employees.add(e1);
employees.add(e2);
employees.add(e3);
employees.add(e4);
employees.add(e5);
employees.add(e6);

}

public List<Employee> getEmployees() {

return employees;
}
}

index.html content

<?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>JSF <h:dataable> example</title>
</h:head>
<h:body>
<h:dataTable cellpadding="4" border="1" bgcolor="cyan" value="#{EmployeeGenerator.employees}" var="employee">
<f:facet name="header">
<h:outputText value="Emlpoyee <h:datatable> Example" />
</f:facet>

<h:column>
<f:facet name="header" >
<h:outputText value="Employee ID"/>
</f:facet>
<h:outputText value="#{employee.employeeID}"/>
</h:column>

<h:column>
<f:facet name="header" >
<h:outputText value="Employee Name"/>
</f:facet>
<h:outputText value="#{employee.employeeName}"/>
</h:column>

<h:column>
<f:facet name="header" >
<h:outputText value="Employee Surname"/>
</f:facet>
<h:outputText value="#{employee.employeeSurname}"/>
</h:column>

<h:column>
<f:facet name="header" >
<h:outputText value="Employee Phone"/>
</f:facet>
<h:outputText value="#{employee.employeePhoneNumber}"/>
</h:column>
</h:dataTable>

</h:body>
</html>

Use this url for accessing the index.xhtml page

http://localhost:8080/JSFhdatatableExample/faces/index.xhtml

The output of the program;

Download source

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s