4

问题很短。我创建了一个p:datatable,但在其中p:column我实际上有一个div元素。不幸的是,数据表应该有可选择的行,而 div 不会合作;)。所以解决方法是手动调用,在div元素上有onclick监听,但是应该怎么调用数据表的rowSelection呢?是否有一些 Primefaces 元素的功能列表?

编码:

<p:dataTable var="user" value="#{rec.friends}" rowKey="#{user.id}" widgetVar="friendscrollist"
        rendered="#{not empty rec.friends}" scrollable="true" rowIndexVar="findex"
        scrollHeight="500" scrollWidth="220" selectionMode="single" selection="#{rec.chosenFriend}" styleClass="friendscroll">
                <p:column width="198" id="friend#{findex}">
    <div class="friendlist" onclick="friendscrollist.clickRow(#{findex})" />
                </p:column>
                <p:ajax update=":leftform" event="rowSelect" />
                <p:ajax update=":leftform" event="rowUnselect" />
</p:dataTable>

当然它是一个简化版本,只有你需要的东西。所以问题是在div onclick?

4

5 回答 5

12

正是您所需要的<p:dataTable widgetVar>hasunselectAllRows()和functions。selectRow(index)

<div onclick="friendscrollist.unselectAllRows(); friendscrollist.selectRow(#{findex})">

friendscrollist.不幸的是,这些功能没有可用的文档,但在 Chrome/Firebug 中,当您进入JS 控制台时,您可以在自动完成列表中看到所有可用功能的列表。下面是来自 Chrome 的屏幕:

在此处输入图像描述

查看 JS 源代码或基于函数名称的常识应该告诉/提示您这些函数的作用。


更新:我的立场得到纠正,其中一些功能实际上记录在PrimeFaces 3.4 User's Guide中。它们位于第 146 页第 3.26 章“数据表”的“客户端 API”部分。

于 2013-01-12T17:13:18.303 回答
2

接受的解决方案适用于单个选择表,但不适用于多选。解决这个问题的另一种方法应该适用于两者是使用以下而不是<div>

<h:panelGroup layout="block">

这将<div>在您的列内呈现,并且不会干扰 onclick 事件处理。

于 2013-06-13T17:35:16.520 回答
1

对于分页,您可以通过这种方式控制每页问题的行数:

friendscrollist.selectRow(#{rowIndex} - friendscrollist.paginator.getCurrentPage() * friendscrollist.paginator.cfg.rows);
于 2014-08-20T07:24:10.993 回答
0

如果启用了分页,您可以执行以下操作:

onmouseup="friendscrollist.unselectAllRows();friendscrollist.selectRow(#{rowIndex} - friendscrollist.paginator.getCurrentPage() * 15);"

当 15 是表中的行数时。

我没有找到一种以编程方式获取行数的方法......

于 2014-07-01T14:25:49.230 回答
0

我想为所有遇到类似问题的右键单击或上下文菜单的人添加其他信息。如果您正在使用,则无法捕获右键单击事件<p:graphicimage>。不知何故,<img>标签的 oncontextmenu 事件在 primefaces 中被删除。

如果要通过右键单击行内的图像内容来选择行,则应使用 tag 和 oncontextmenu 事件。

<img src="..." oncontextmenu="dataTable.unselectAllRows();dataTable.selectRow(#{rowIndex});"/> 
于 2013-10-11T07:24:30.640 回答