我正在使用PrimeFaces DataTable来显示记录（在沙箱应用程序中随机生成）。我正在使用复选框选择版本。基本的DataTable工作正常，包括删除和取消按钮（确认对话框中只能提供这些功能）。我正在尝试向DataTable添加功能，以便在选中复选框时，将根据选择启用或禁用页面上的其他控件。
换句话说，如果未选择任何行（未选中复选框），则禁用或不呈现某些按钮和/或菜单项。通过单击复选框选择一行或多行应启用或呈现控件。我已经尝试使用内置的JavaScript事件处理程序，但我无法使其工作。
现在我的页面显示DataTable 5列：复选框选择列，名字，姓氏，年龄。我使用简单的布尔复选框并使用onclick事件更新布尔值，在我的另一个沙盒中创建了类似这样的工作。不幸的是，这个DataTable似乎没有任何相似之处 - 或者如果我不知道如何实现它。
我的索引页：
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.prime.com.tr/ui"
xmlns:c="http://java.sun.com/jsp/jstl/core"
xmlns:ui="http://java.sun.com/jsf/facelets">
<body>
<ui:composition template="./newTemplate.xhtml">
<ui:define name="content">
<h:form>
<p:dataTable rowSelectListener="#{tableBean.onRowSelect}" var="data" value="#{tableBean.data}" paginator="true" rows="10"
selection="#{tableBean.selectedNames}">
<f:facet name="header">
Customer List
</f:facet>
<p:column selectionMode="multiple" />
<p:column headerText="Cust ID">
<h:outputText value="#{data.id}" />
</p:column>
<p:column headerText="First Name">
<h:outputText value="#{data.firstName}" />
</p:column>
<p:column headerText="Last Name">
<h:outputText value="#{data.lastName}" />
</p:column>
<p:column headerText="Age">
<h:outputText value="#{data.age}" />
</p:column>
<f:facet name="footer">
<p:commandButton update="deleteList" value="Delete" oncomplete="deleteDlg.show()" />
</f:facet>
</p:dataTable>
<p:dialog header="Delete Selected Records" modal="true" widgetVar="deleteDlg"
>
<h:outputText value="You are about to permanently delete records." /><br /><br />
<h:outputText value="Are you sure you want to continue?" /><br /><br/>
<h:commandButton value="CANCEL" action="#{tableBean.cancelDelete()}" /> <h:commandButton value="Delete" action="#{tableBean.deleteNames()}" />
</p:dialog>
</h:form>
</ui:define>
</ui:composition>
</body>
</html>
来自我的支持bean的代码可能是相关的：
public void deleteNames()
{
for(Data person : selectedNames)
{
data.remove(person);
}
}
public void cancelDelete()
{
for(Data name : selectedNames)
selectedNames = null;
}
public void onRowSelect(SelectEvent event)
{
if(selectedNames == null || selectedNames.length < 1)
setDisable(true);
else
setDisable(false);
}
public boolean isDisable() {
if(selectedNames == null || selectedNames.length < 1)
disable = true;
else
disable = false;
return disable;
}
public void setDisable(boolean disable) {
this.disable = disable;
}
答案 0 :(得分：1)
确实有一种解决方法，至少对我有用。
PrimeFaces.widget.DataTable.prototype.selectRowWithCheckbox = function(element) {
...
...
//save state
this.writeSelections();
// added to add instant row selection
this.fireRowSelectEvent(rowId);
// end
}
<p:datatable widgetVar="wv1" id='mydatatable' ....>
...
<p:datatable/>
<script type="text/javascript">
if(!wv1_main.cfg.onRowSelectUpdate){
wv1.cfg.onRowSelectUpdate="";
}else{
wv1.cfg.onRowSelectUpdate+=" ";
}
wv1.cfg.onRowSelectUpdate+="UPDATE_IDS";
</script>
将'UPDATE_IDS'替换为您的面板ID，以及“panel1 panel2”等空格分隔;
<h:header/>
...
<script type="text/javascript" src="#{CONTEXT_PATH}/resources/js/datatable.js"/>
<h:header/>
您可以使用更多修改来突出显示所选行
答案 1 :(得分：1)
正在寻找同一问题的解决方案，因为 JSF 2 / Primefaces 这些天发展得相当快，找到了更多 Primefaces 的最新解决方案版本 3.0 或更高。
根据PrimeFaces论坛帖子中的以下答案： http://forum.primefaces.org/viewtopic.php?f=3&t=1373&sid=bbfcd6a343edf586f927cd7ecd7d01b9&start=10#p48388
可以通过执行以下步骤将客户端javascript处理程序添加到<p:datatable>组件：
1.将primefaces-extension JAR添加到您的webapp的类路径中（此库也可以在同名的Maven仓库中找到）。我尝试了0.6.3版本，这是撰写本文时的最新版本，它对我有用
2.将pe命名空间添加到相应的xhtml文件：
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.prime.com.tr/ui"
xmlns:c="http://java.sun.com/jsp/jstl/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:pe="http://primefaces.org/ui/extensions">
...
</html>
3.将<pe:javascript>作为子元素添加到<p:datatable>组件（可以实际添加到任何实现ClientBehaviorHolder接口的组件），如下所示：
<html>
...
<p:dataTable rowSelectListener="#{tableBean.onRowSelect}" var="data" value="#{tableBean.data}" paginator="true" rows="10" selection="#{tableBean.selectedNames}">
<pe:javascript event="rowSelect" execute="onRowSelectedHandler();"/>
...
</p:dataTable>
...
</html>
那应该是它，希望这会有所帮助......
答案 2 :(得分：0)
您可以捕获选中该行时触发的ajax个事件。
在你的情况下，
<p:dataTable rowSelectListener="#{tableBean.onRowSelect}"
var="data" value="#{tableBean.data}" paginator="true" rows="10"
selection="#{tableBean.selectedNames}">
<p:ajax event="rowSelectCheckbox" listener="#{tableBean.handleEvent}"
update="buttonThatNeedsToBeRendered"/>
<p:column selectionMode="multiple" />
...
</p:dataTable>
根据dataTable的选择模式触发的其他有用事件是：
rowSelect和rowUnselect rowSelectCheckbox和rowUnselectCheckbox rowSelectRadio toggleSelect