<转>关于h:dataTable的使用

本文介绍了JSF中h:dataTable的使用方法,包括传统JSP方式、使用actionListener及绑定table等方式处理表格数据。此外还探讨了如何实现表格的多选操作及改进方案。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

关于h:dataTable的使用
基本用法

后台处理

可以在table的每一行增加操作用于处理当前行(比如删除当前行),也可以在table外增加操作处理整个table(更新整个table),页面代码如下:
我们可以有多种方式来处理
1】 传统的jsp方式,也是很多初学者首先想到的方式,这种方式本质上和以前的方式没有区别,只是披上了jsf的外衣而已,强烈建议不要使用。并且这样没有办法处理整个table,按以前的方式处理是相当的麻烦。
给每一行的操作增加参数,然后在后台提取该参数
<t:dataTable var="emp" .... > 
<h:commandLink id="editLink" action="#{employeeAction.prepareEdit}">
<h:outputText value="#{msg.edit}"/>
<f:param name="id" value="#{emp.id}"/>
</h:commandLink>

FacesContext context = FacesContext.getCurrentInstance(); 
Map map = context.getExternalContext().getRequestParameterMap();
String employeeID = (String) map.get("id");

2】 使用actionListener,来取得当前行的数据。整个表的处理很简单,直接获取list即可(参加方法3)
<h:commandLink> 
<f:actionListener type="net.java.OrderActionListener" />
<h:outputText value="Order" />
</h:commandLink>

public class orderActionListener implements ActionListener { 

public void processAction(ActionEvent anEvent) throws AbortProcessingException {

YourBeanClass tmpBean = null;

UIComponent tmpComponent = anEvent.getComponent();

while (null != tmpComponent && !(tmpComponent instanceof UIData)) {
tmpComponent = tmpComponent.getParent();
}

if (tmpComponent != null && (tmpComponent instanceof UIData)) {
Object tmpRowData = ((UIData) tmpComponent).getRowData();
if (tmpRowData instanceof YourBeanClass) {
tmpBean = (YourBeanClass) tmpRowData;

//TODO Implementation of your method

}
}

3】 通过绑定tale,这样就可以在后台直接通过table来获取当前行了,而不像方法2那样通过事件来获得table
<h:dataTable binding="#{testSelectItems.table}" id="hotels" value="#{testSelectItems.list}" var="hot"> 
<h:column id="c1">
<f:facet name="header" id="f1">label</f:facet>
<h:inputText id="bbb" value="#{hot.label}" required="true"/>
</h:column>
<h:column id="c2">
<f:facet name="header" id="f2">value</f:facet>

<h:inputText id="aaa" value="#{hot.value}" required="true"/>
</h:column>
<h:column id="c3">
<f:facet name="header" id="f3">link</f:facet>
<!- 处理当前行
<h:commandLink id="ccc" action="#{testSelectItems.actionTest1}" value="#{hot.value}">
xxx#{hot.label}
</h:commandLink>
</h:column>
</h:dataTable>
<!- 处理全部行
<h:commandButton action="#{testSelectItems.actionTest}"/>
</h:form>

public class TestSelectItems { 
private UIData table=new UIData();
private List list;

public List getList(){
System.out.println("---TestSelectItems-getList----1---");
if(list==null){
System.out.println("--TestSelectItems-getList-----2---");
list=new ArrayList();
SelectItem it=new SelectItem();
it.setLabel("lable1");
it.setValue("1");
list.add(it);
it=new SelectItem();
it.setLabel("lable2");
it.setValue("2");
list.add(it);
}
return list;
}
//处理全部行
public void actionTest(){
System.out.println("----list.size():"+list.size());
System.out.println("--actionTest--");
}
//处理单行
public void actionTest1(){
SelectItem dd=(SelectItem)table.getRowData();
System.out.println("--actionTest1--:"+dd.getLabel());
}
public UIData getTable() {
return table;
}
public void setTable(UIData table) {
this.table = table;
}

增加多选操作
目前的table只支持单行操作和全部行操作,而不支持多选操作,比如每行号前有个复选框,用于批量删除。
通常做法
通常的做法是改写值对象,或者改写值对象的基类,在其中增加checked属性
------------------------------------------------
public abstract class BaseObject implements Serializable { 
private boolean checked;

public void setChecked(boolean value) {
this.checked = value;
}
public boolean isChecked(){
return this.checked;
}
...
}

在页面上使用
<h:selectBooleanCheckbox value="#{e.checked}" /> 
<h:dataTable var="e" value="#{typeallList.typeallModel }">
<f:facet name="header"><h:outputText value="#{text['typeall.typelist'] }"/>
</f:facet>
<h:column>
<f:facet name="header"><h:outputText value="#{text['list.checkall'] }"/></f:facet>
<h:selectBooleanCheckbox value="#{e.checked}" />
</h:column>

提交后循环全部行,取出选择的行
public String removeChecked(){ 
List tempList = typeallModel.getWrappedObject();
for (int i=0;i<tempList.size();i++){
OaTypeall obj=(OaTypeall)tempList.get(i);
if (obj.isChecked()) {
//删除obj
}
return null;
}

该方法的缺点是需要修改值对象,而添加的属性对值对象而言是没有意义的。这种方式破坏了对象的内聚性,把与该对象不相关的属性强添加到对象中。
新思路
页面使用方式不变,不用修改值对象的类,用ListCheckedDataModel封装list,在其中动态给list中的对象增加checked属性,并增加获取所以选择行的list。关键点是如何给值对象动态增加属性。可以考虑使用动态字节码操作javassist来动态增加字段
实现原理
[color=green](似乎作者未贴完)[/color]
打印按钮和表格空一点距离, <p:dialog id="dlgInfo" header="详情" widgetVar="dlgInfo" modal="true" height="500px" width="1200px"> <p:autoUpdate/> <p:commandButton value="打印" actionListener="#{tool_personClear.downLoad()}" ajax="true" style="width:80px"> </p:commandButton> <p:dataTable id="detailList" widgetVar="detailList" var="row" reflow="true" value="#{tool_personClear.detailInfo}" resizableColumns="true" style="margin-bottom:20px;font-size:15px" rowHover="true" rowIndexVar="rowvar"> <p:column headerText="序号" style="text-align:center;width:18px"> <h:outputText value="#{rowvar + 1}"/> </p:column> <p:column headerText="单号" style="text-align:left;width:80px"> <h:outputText value="#{row.requestNo}"/> </p:column> <p:column headerText="工号" style="text-align:left;width:80px"> <h:outputText value="#{row.empNo}"/> </p:column> <p:column headerText="姓名" style="text-align:left;width:80px"> <h:outputText value="#{row.empName}"/> </p:column> <p:column headerText="物料编码" style="text-align:left;width:110px"> <h:outputText value="#{row.itemCode}"/> </p:column> <p:column headerText="物料描述" style="text-align:left;width:330px"> <h:outputText value="#{row.itemDesc}"/> </p:column> <p:column headerText="销数" style="text-align:center;width:20px"> <h:outputText value="#{row.qty}"/> </p:column> <p:column headerText="原数量" style="text-align:left;width:50px"> <h:outputText value="#{row.holdQty}"/> </p:column> </p:dataTable> </p:dialog> </div> </p:outputPanel>
08-02
<?xml version='1.0' encoding='UTF-8'?> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:cc="http://java.sun.com/jsf/composite" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:p="http://primefaces.org/ui"> <cc:interface/> <cc:implementation> <p:dialog header="周达成率记录" id="weekSummaryLogDia" widgetVar="weekSummaryLogDia" position="center" modal="true"> <p:dataTable id="summaryLog" widgetVar="summaryLog" value="#{wtWeekSummaryBean.showWeekSummaryLogs}" var="entity" currentPageReportTemplate="{startRecord}-{endRecord} of {totalRecords} records" paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}" emptyMessage="没有数据" rows="10" resizableColumns="true" style="width:450px;" rowHover="true" rowIndexVar="rowvar"> <p:column headerText="序号" style="width:15px;text-align: center;"> <h:outputText value="#{rowvar+1}"/> </p:column> <p:column headerText="周id" style="width:60px;text-align:center;"> <h:outputText value="#{entity.weekId}"/> </p:column> <p:column headerText="工号" sortBy="#{empNo}" style="width:60px;text-align:center;"> <h:outputText value="#{entity.empNo}"/> </p:column> <p:column headerText="姓名" width="50" style="text-align:center;"> <h:outputText value="#{entity.empName}"/> </p:column> <p:column headerText="网页工时" style="width:60px;text-align:right"> <h:outputText value="#{entity.webWt}"> <f:convertNumber maxFractionDigits="2" minFractionDigits="2"/> </h:outputText> </p:column> <p:column headerText="OPT工时" style="width:60px;text-align:right"> <h:outputText value="#{entity.optWt}"> <f:convertNumber maxFractionDigits="2" minFractionDigits="2"/> </h:outputText> </p:column> <p:column headerText="品质扣分" style="width:60px;text-align:right"> <h:outputText value="#{entity.deductWt}"> <f:convertNumber maxFractionDigits="2" minFractionDigits="2"/> </h:outputText> </p:column> <p:column headerText="合计产出" style="width:60px;text-align:right"> <h:outputLabel value="#{entity.totalWt}"> <f:convertNumber maxFractionDigits="2" minFractionDigits="2"/> </h:outputLabel> </p:column> <p:column headerText="实际出勤" style="width:60px;text-align:right"> <h:outputText value="#{entity.onDutyHour}"/> </p:column> <p:column headerText="出勤率" style="width:50px;text-align:right"> <h:outputText value="#{entity.onDutyRate}"> <f:convertNumber type="percent" maxFractionDigits="1"/> </h:outputText> </p:column> <p:column headerText="达标率" style="width:50px;text-align:right"> <h:outputText value="#{entity.uptoStandardRate}"> <f:convertNumber type="percent" maxFractionDigits="2" /> </h:outputText> </p:column> <p:column headerText="创建时间" style="display:none;"> <h:outputText value="#{entity.createTime}"> <f:convertDateTime pattern="yyyy-MM-dd HH:mm:ss" timeZone="GMT+8"/> </h:outputText> </p:column> <p:column headerText="更新时间" style="display:none;"> <h:outputText value="#{entity.updateTime}"> <f:convertDateTime pattern="yyyy-MM-dd HH:mm:ss" timeZone="GMT+8"/> </h:outputText> </p:column> </p:dataTable> </p:dialog> </cc:implementation> </html> 我JSF 碎片页面是这样的,可能别的项目调用后这边弹窗显示数据
最新发布
08-08
<?xml version='1.0' encoding='UTF-8'?> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:cc="http://java.sun.com/jsf/composite" xmlns:lkmcc="http://java.sun.com/jsf/composite/lkmComponent" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:p="http://primefaces.org/ui" xmlns:c="http://java.sun.com/jsp/jstl/core"> <cc:interface/> <cc:implementation> <p:dialog header="周达成率记录" id="weekSummaryLogDia" widgetVar="weekSummaryLogDia" position="center" modal="true"> <p:dataTable id="summaryLog" widgetVar="summaryLog" value="#{wtWeekSummaryBean.showWeekSummaryLogs}" var="entity" currentPageReportTemplate="{startRecord}-{endRecord} of {totalRecords} records" paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}" emptyMessage="没有数据" rows="10" resizableColumns="true" style="width:450px;" rowHover="true" rowIndexVar="rowvar"> <p:column headerText="序号" style="width:15px;text-align: center;"> <h:outputText value="#{rowvar+1}"/> </p:column> <p:column headerText="周id" style="width:60px;text-align:center;"> <h:outputText value="#{entity.weekId}"/> </p:column> <p:column headerText="工号" sortBy="#{empNo}" style="width:60px;text-align:center;"> <h:outputText value="#{entity.empNo}"/> </p:column> <p:column headerText="姓名" width="50" style="text-align:center;"> <h:outputText value="#{entity.empName}"/> </p:column> <p:column headerText="网页工时" style="width:60px;text-align:right"> <h:outputText value="#{entity.webWt}"> <f:convertNumber maxFractionDigits="2" minFractionDigits="2"/> </h:outputText> </p:column> <p:column headerText="OPT工时" style="width:60px;text-align:right"> <h:outputText value="#{entity.optWt}"> <f:convertNumber maxFractionDigits="2" minFractionDigits="2"/> </h:outputText> </p:column> <p:column headerText="品质扣分" style="width:60px;text-align:right"> <h:outputText value="#{entity.deductWt}"> <f:convertNumber maxFractionDigits="2" minFractionDigits="2"/> </h:outputText> </p:column> <p:column headerText="合计产出" style="width:60px;text-align:right"> <h:outputLabel value="#{entity.totalWt}"> <f:convertNumber maxFractionDigits="2" minFractionDigits="2"/> </h:outputLabel> </p:column> <p:column headerText="实际出勤" style="width:60px;text-align:right"> <h:outputText value="#{entity.onDutyHour}"/> </p:column> <p:column headerText="出勤率" sortBy="#{onDutyRate}" style="width:50px;text-align:right"> <h:outputText value="#{entity.onDutyRate}"> <f:convertNumber type="percent" maxFractionDigits="1"/> </h:outputText> </p:column> <p:column headerText="达标率" sortBy="#{uptoStandareRate}" style="width:50px;text-align:right"> <h:outputText value="#{entity.uptoStandardRate}"> <f:convertNumber type="percent" maxFractionDigits="2" /> </h:outputText> </p:column> <p:column headerText="创建时间" style="display:none;"> <h:outputText value="#{entity.createTime}"> <f:convertDateTime pattern="yyyy-MM-dd HH:mm:ss" timeZone="GMT+8"/> </h:outputText> </p:column> <p:column headerText="更新时间" style="display:none;"> <h:outputText value="#{entity.updateTime}"> <f:convertDateTime pattern="yyyy-MM-dd HH:mm:ss" timeZone="GMT+8"/> </h:outputText> </p:column> </p:dataTable> </p:dialog> </cc:implementation> </html> 我新写的jsf碎片 别的项目要引用 这样写有没有问题
08-08
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值