0

我将 Primefaces 3.3.1 与 Tomcat 7.0.22.0 一起使用。我有 p:dataTable 其中有 p:inputText 。该 p:dataTable 的 id 是“houseTabID:tabView:form0:table”。这是从 HTML 源代码复制粘贴的。我让对话框(它在数据表所在的表单之外)通过 p:dataTable 中的按钮打开,并且该对话框中的 p:commandButton 更新了 dataTable。

p:commandButton 看起来像这样;

<p:commandButton ajax="true" action="#{myBean.setInputText()}"
    value="OK"
    update="#{myBean.getUpdateTarget(0)}"/>

myBean.getUpdateTarget(0) 重新运行正确的字符串以指向目标组件。

我可以通过指定“houseTabID:tabView:form0:table”(意味着 myBean.getUpdateTarget(0) 返回该字符串)成功更新整个 dataTable。但是我在表格中有很多行,所以更新整个表格需要更长的时间才能完成,并且滚动位置被重置,这真的很烦人。这让我只想更新表格中的一行,而不是全部。

所以我首先返回“houseTabID:tabView:form0:table:inputBox”来更新我想要更新的 p:inputText。在 p:dataTable 我有一些看起来像这样的东西;

<p:column headerText="Value"
    width="300" style="height:16px; font-size:9pt;">
    <p:inputText id="inputBox" value="#{myItem.value}"
        style="width:95%; height:11px; font-size:9pt;">
        <f:ajax execute="@this" event="blur" />
    </p:inputText>
</p:column>

结果:没有更新,没有错误日志。我知道“houseTabID:tabView:form0:table:inputBox”不起作用,因为它没有指定表中的行。因此,通过使用 rowIndexVar,我尝试使用“houseTabID:tabView:form0:table:0:inputBox”制作:0: 部分来自 rowIndexVar。该字符串是从 HTML 源代码复制粘贴的。但不幸的是,我得到了例外。

javax.faces.FacesException: Cannot find component with identifier ":houseTabID:tabView:form0:table:0:inputBox" referenced from "houseTabID:j_idt181:j_idt186".

为什么?显然有“houseTabID:tabView:form0:table:0:inputBox”,我在 HTML 源代码上看到它,我可以用“houseTabID:tabView:form0:table”更新整个 talbe,但用“houseTabID:tabView:form0”抛出异常:表:0:输入框“?这对我来说没有意义。另外,为什么它不会抛出任何异常或使用“houseTabID:tabView:form0:table:inputBox”溢出错误日志?我验证了那个 p:commandButton 的 HTML 源代码;

onclick="PrimeFaces.ab({source:'houseTabID:j_idt190:j_idt195',update:'houseTabID:tabView:form0:table:inputBox',

我非常想只更新一行而不是整个 p:dataTable。请帮我。

4

2 回答 2

1

我找到了解决方案。根据这段对话,

position = JQuery(".ui-datatable-scrollable-body").scrollTop();
JQuery(".ui-datatable-scrollable-body").scrollTop(position);

可以做到这一点。看来这是获取和设置 p:dataTable 垂直滚动位置的唯一方法。我在打开对话框之前保存了位置,并在从对话框更新 p:dataTable 后设置了位置。它奏效了,这就是我想做的。

但上述方法存在严重问题。该代码从顶部扫描给定的类“.ui-datatable-scrollable-body”并在第一个找到的处执行。所以它只适用于一个 p:dataTable。幸运的是,我可以提出第二个解决方案。

<script type="text/javascript">
    $ = jQuery;
    var scrollPos;
        function saveScrollPos()
        {
            scrollPos = $("#houseTabID\\:tabView\\:form0\\:table_data").parents(".ui-datatable-scrollable-body").scrollTop();
        }
        function getScrollPos()
        {
            $("#houseTabID\\:tabView\\:form0\\:table_data").parents(".ui-datatable-scrollable-body").scrollTop(scrollPos);
        }
</script>

FireFox 中的 FireBug 帮助我发现 Primefaces 添加了“_data”的组件 ID。请看我的问题,我的数据表的 id 是“table”并且有人创建了“table_data”。我可以用上面显示的转义语法指出它,并且函数 parents() 会导致该位置。它在我的应用程序中运行良好。

我真的很感谢 stier01,他发布了他的解决方案,这是我在网上唯一能找到的解决方案。而且我真的很难过 Primefaces p:dataTable 不支持这样一个基本的东西。我知道我们中的许多人都希望在更新时保持 p:dataTable 的滚动位置。我希望它会在不久的将来得到改进。

于 2012-08-15T00:23:02.010 回答
0

我在这里所知道的边缘摇摇欲坠,但我怀疑这可能是由于页面构建的时间而发生的。构建 DOM 树时,您的表行尚不存在,因此您在表外的按钮无法找到对该行的引用(因为它尚不存在)。构建树并填充数据后,行就在那里。这就是为什么在页面呈现后您可以查找列 id,但不能从表外部引用它。

我不确定解决方案。也许您可以在数据表标签中放置一个远程命令来更新它。也许可以在 JS 中做点什么。

于 2012-07-27T13:17:55.577 回答