h:dataTable标签动态地用表格的方式输出数据, 它是JSF独有的东西,它会被翻译为一个html的table,,感觉就和struts的logic:iterator差不多,下面是一般的用法:
< h:dataTable value ='#{items}' var ='item'>
2
3 <h:column >
4
5 < %-- left column components --% >
6
7 < h:outputText value ='#{item.propertyName}'/>
8
9 </h:column >
10
11
12
13 < h:column >
14
15 < %-- next column components --% >
16
17 < h:outputText value ='#{item.anotherPropertyName}'/>
18
19 </h:column >
20
21
22
23 < %-- add more columns, as desired --% >
24
25 </ h:dataTable >
26
其中这个items可以是一个集合(其类型可以是array、java.util.List、java.sql.ResultSet、javax.servlet.jsp.jstl.sql.Result、javax.faces.model.DataModel,循环遍历所有的item),或者是其他任何非集合的元素(循环一次)。
注意1)h:dataTable里面只能包含h:column。2)在h:dataTable这种能render子元素的标签中,要显示原始文本的话,要用<f:verbatim></f:verbatim>将文本包含起来(或者用h:outputText)。3) <f:facet name="header">和<f:facet name="footer">可以制定表头和表尾。
h:dataTable有以下这些属性:
bgcolor
Background color for the table
border
Width of the table's border
cellpadding
Padding around table cells
cellspacing
Spacing between table cells
columnClasses
Comma-separated list of CSS classes for columns
first
Index of the first row shown in the table
footerClass
CSS class for the table footer
frame
Specification for sides of the frame surrounding the table should be drawn; valid values: none, above, below, hsides, vsides, lhs, rhs, box, border
headerClass
CSS class for the table header
rowClasses
Comma-separated list of CSS classes for columns
rules
Specification for lines drawn between cells; valid values: groups, rows, columns, all
summary
Summary of the table's purpose and structure used for non-visual feedback such as speech
var
The name of the variable created by the data table that represents the current item in the value
binding, id, rendered, styleClass, value
Basic attributes
dir, lang, style, title, width
HTML 4.0
onclick, ondblclick, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup
DHTML events
f:facet标签用来为包含f:facet标签的父组件与被f:facet标签所包含的子组件之间申明一种特殊的关系。常与h:panelGrid,h:dataTable等标签连用,申明组件为标题或页脚。
f:facet用法例:
f:facet常用用法
<jsf组件>
<f:facet name="facet名">...jsf组件</f:facet>
</jsf组件>
h:dataTable使用f:facet例:
<h:dataTable value="#{myBean.bookList}" var= "book" border="1px">
<h:column>
<f:facet name="header">
<h:outputText value="Title"/>
</f:facet>
<h:outputText value="#{book.title}"/>
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="Price"/>
</f:facet>
<h:outputText value="#{book.price}"/>
</h:column>
</h:dataTable>
对应HTML代码:
<table border="1px">
<thead>
<tr>
<th>Title</th>
<th>Price</th>
</tr>
</thead>
<tbody>
<tr>
<td>老人与海</td>
<td>23.00</td>
</tr>
</tbody>
</table>
浏览器显示:
Title | Price |
老人与海 | 23.00 |