You can drag the Standard JavaServer Faces Data Table component 
from
the Palette to the Visual Designer to create a data table, a table
that you can fill with data from a database table or some other
source of repeating information for which the number of rows
is not known ahead of time.
- This component is a JavaServer Faces reference implementation that cannot use themes. The Table component in the Basic category of the Palette does support themes and provides other features that improve ease of use.
If you want a table that serves as an HTML layout element, use the Grid Panel component from the Layout category of the Palette instead.
A Data Table initially has Output Text components in each table cell. You can modify this component type if you like.
Data Tables render as <table> tags in HTML.
After dragging the component to the Visual Designer, you can do a number of things with it:
- Select either any text element, or a column, or the Data
Table element. The Data Table component consists of a series
of columns that contain Output
Text components
,
as you can see in
this screen shot
of a default data table and the data table's components
in the Outline window. You use the OutputText
components to set the data that displays in individual columns
and cells of the table, and you use the DataTable
part to specify how the table looks and to bind the entire
Data Table to a data provider.
In the Outline window, the first outputText component in a column is the column header, the second represents the column data, and if you add column footers in the Data Table Layout Dialog Box, there is a third outputText component that represents the footer.
- You can bind a Data Table component to a data provider for a RowSet by
dropping a database table on the component, as described in
Binding
Data to a Data Table Component. You can also bind the
Data Table separately to an object or data provider by setting
the value property, which is described below.
The tutorial "Using Databound Components to Access Databases" at the following web site shows how to work with a Data Table component:
Java Studio Creator Tutorials
- After binding the Data Table, you can right-click either
the outer border of the component or the dataTable node in
the Outline window and choose Table Layout to design
the table, as described in Data
Table Layout Dialog Box.
- Select the component and drag it to another location on
the page.
- Select the Data Table part
of the component and edit its properties in the Data Table
property
sheet. Some typical properties you might set are:
- id. The name of the Data Table. In the JSP
file, this name is the value of the id attribute.
In the page bean, this property's value is the name of
the HtmlDataTable object.
- value. Type: Object
The object or database table that provides values for the table. Clicking the ellipsis (...) button opens a dialog box that enables you to bind the value property either to a database table or to another object. The types of objects to which this component can be bound are:- RowSetDataModel, created for you when you
drop a database table on this component
- Any instance of javax.faces.model.DataModel
- A list or array of JavaBeans
- A single JavaBean, treated as a one-row table
- RowSetDataModel, created for you when you
drop a database table on this component
- border. Size of the table borders in pixels.
- cellpadding. Type: String
Number of pixels to add on all sides of the contents of each cell.
- cellspacing. Type: String
Spacing between cells in pixels.
- rows. Type: int
The number of rows displayed at one time in the Data Table. If the number is zero, all rows of the database table will be displayed at once. This value is updated automatically if you use the Paging tab of the Table Layout dialog box, and enable paging.
- Various properties specifying CSS style classes and
styles that can be applied to the table columns, the table
rows, the header and footer, and the entire table.
- id. The name of the Data Table. In the JSP
file, this name is the value of the id attribute.
In the page bean, this property's value is the name of
the HtmlDataTable object.
- Select the OutputText parts
of the component and edit their properties in the Output Text
property
sheet. You can bind the Output Text components to a table
or another component and set their values dynamically. You
can select a column in the Outline window and bind its
Output Text components separately from other columns in the
table. Each column of the table has two Output Text components,
one for the heading and another for all the cells in the column,
each of which can be separately bound.
Close