dataTable

h:dataTable标签动态地用表格的方式输出数据, 它是JSF独有的东西,它会被翻译为一个htmltable,,感觉就和strutslogiciterator差不多,下面是一般的用法:

< 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可以是一个集合(其类型可以是arrayjava.util.Listjava.sql.ResultSetjavax.servlet.jsp.jstl.sql.Resultjavax.faces.model.DataModel,循环遍历所有的item),或者是其他任何非集合的元素(循环一次)。
注意1h:dataTable里面只能包含h:column2)在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:panelGridh: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

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值