JavaServer Faces (JSF) - JSF DataTable - JSF Display DataTable - JavaServer Faces (JSF)

What is JSF h:dataTable?

h:dataTable tag is used to display data in a tabular fashion.

JSF Tag

Rendered Output

Tag Attributes

S.No
Attribute & Description
1
id
Identifier for a component
2
rendered
A boolean; false suppresses rendering
3
dir
Direction for text. Valid values areltr(left to right) andrtl(right to left)
4
styleClass
Cascading stylesheet (CSS) class name
5
value
A component’s value, typically a value binding
6
bgcolor
Background color for the table
7
border
Width of the table's border
8
cellpadding
Padding around table cells
9
cellspacing
Spacing between table cells
10
columnClasses
Comma-separated list of CSS classes for columns
11
first
Index of the first row shown in the table
12
footerClass
CSS class for the table footer
13
frame
Specification for sides of the frame surrounding the table should be drawn; valid values: none, above, below, hsides, vsides, lhs, rhs, box, border
14
headerClass
CSS class for the table header
15
rowClasses
Comma-separated list of CSS classes for rows
16
rules
Specification for lines drawn between cells; valid values: groups, rows, columns, all
17
summary
Summary of the table's purpose and structure used for non-visual feedback such as speech
18
var
The name of the variable created by the data table that represents the current item in the value
19
title
A title, used for accessibility, that describes an element. Visual browsers typically create tooltips for the title’s value
20
width
Width of an element
21
onblur
Element loses focus
22
onchange
Element’s value changes
23
onclick
Mouse button is clicked over the element
24
ondblclick
Mouse button is double-clicked over the element
25
onfocus
Element receives focus
26
onkeydown
Key is pressed
27
onkeypress
Key is pressed and subsequently released
28
onkeyup
Key is released
29
onmousedown
Mouse button is pressed over the element
30
onmousemove
Mouse moves over the element
31
onmouseout
Mouse leaves the element’s area
32
onmouseover
Mouse moves onto an element
33
onmouseup
Mouse button is released

Example Application

A test JSF application is created to test the above tag.

Step
Description
1
Create a project with a namehelloworldunder a packagecom.wisdomjobs.testas explained in theJSF - h:outputStylesheetsub-chapter ofJSF - Basic Tagschapter.
2
Modifystyles.cssas explained below.
3
CreateEmployee.javaunder packagecom.wisdomjobs.testas explained below.
4
CreateUserData.javaas a managed bean under packagecom.wisdomjobs.testas explained below.
5
Modifyhome.xhtmlas explained below. Keep the rest of the files unchanged.
6
Compile and run the application to make sure the business logic is working as per the requirements.
7
Finally, build the application in the form of war file and deploy it in Apache Tomcat Webserver.
8
Launch your web application using appropriate URL as explained below in the last step.

styles.css

Employee.java

UserData.java

home.xhtml

Once all the changes are done, the application is compiled and run as in JSF – Create Application chapter. On successful creation of the application, the result appears as:

JSF DataTable Display

All rights reserved © 2018 Wisdom IT Services India Pvt. Ltd DMCA.com Protection Status

JavaServer Faces (JSF) Topics