数据表内的 JSF PrimeFaces inputText

Question

JSF-2.0、Mojarra 2.1.19、PrimeFaces 3.4.1

问题摘要:有 p:inputText里面p:dataTable和由 p:remoteCommand 触发的 inputText 操作它将 dataTable 行索引作为参数传递给 f:setPropertyActionListener 。但它总是传递数据表的最后一行，而不是包含当前单击的行的索引 p:inputText .

<小时/>

从我之前的问题可以看出，我正在尝试使用 p:inputText作为 Facebook 等状态的评论接受者。实现包括 p:dataTable 。它的行代表每个状态。看起来像:

<p:dataTable id="dataTable" value="#{statusBean.statusList}" var="status"
                     rowIndexVar="indexStatusList">
    <p:column>
        <p:panel id="statusRepeatPanel">
            <p:remoteCommand name="test" action="#{statusBean.insertComment}"
                update="statusRepeatPanel">
                <f:setPropertyActionListener 
                    target="#{statusBean.indexStatusList}"
                    value="#{indexStatusList}">
                </f:setPropertyActionListener>
            </p:remoteCommand>
            <p:inputText id="commentInput" value="#{statusBean.newComment}"
                onkeypress="if (event.keyCode == 13) { test(); return false; }">
            </p:inputText>
        </p:panel>
    </p:column>
</p:dataTable>

上面的代码表示当按下回车键时，触发 p:remoteCommand它调用托管 bean 的 insert 方法。

@ManagedBean
@ViewScoped
public class StatusBean {
    List<Status> statusList = new ArrayList<Status>();
    public int indexStatusList;
    public String newComment
    //getters and setters
    public void insertComment() {
        long statusID = findStatusID(statusList.get(indexStatusList));
        statusDao.insert(this.newComment,statusID)
    }

我们一起调试吧；假设 p:dataTable 中显示三种状态，单击 p:inputText在第二状态(索引为1)中，输入“relax”并按回车键。

在调试控制台中，它正确显示“relax”，但发现错误的状态，因为 indexStatusList值为 2，属于 p:statusList 中的最后一个状态 。它必须是 1，即 p:inputText 的索引单击数据表行。

我认为问题是关于p:remoteCommand它获取屏幕上的最后一个索引。

<小时/>

它是如何工作的？

假设有一个 p:commandLink而不是p:remoteCommand和p:inputText :

<p:commandLink action=#{statusBean.insertComment>
      <f:setPropertyActionListener target="#{statusBean.indexStatusList}"
          value="#{indexStatusList}"></f:setPropertyActionListener>

此组件成功通过 indexStatusList当前点击的一个。

Answer 1

此解决方案中的概念问题在于 p:remoteCommand 的工作方式。它创建 JavaScript 函数，其名称在 p:remoteCommand 的 name 属性中定义。当您将其放入 dataTable 中时，它将迭代并创建名为 test 的 JavaScript 函数，次数与表中的行数相同，并且最后一个将仅是一个。因此，解决方案可以在 remoteCommand 的名称处附加索引，但这很糟糕，因为您将拥有许多不必要的 JavaScript 函数。更好的方法是创建一个函数并向其传递参数。因此，在数据表之外定义 remoteCommand:

<p:remoteCommand name="test" action="#{statusBean.insertComment}" update="statusRepeatPanel">

并在您的onkeypress事件中调用test函数:

test([{ name: 'rowNumber', value: #{indexStatusList} }])

这将在您的 AJAX 请求中传递 rowNumber 参数。在支持 bean 的 insertComment() 方法中，您可以读取此参数并用它执行任何您想要的操作:

FacesContext context = FacesContext.getCurrentInstance();
Map map = context.getExternalContext().getRequestParameterMap();
Integer rowNumber = Integer.parseInt(map.get("rowNumber").toString());

注意:当您更新每行中的面板时，也许您可​​以将 remoteCommand 的 update 属性更改为 @parent 这样就可以了对于所有行。

编辑:您可以使用 Java 方法中的以下代码更新特定行中的特定面板:

RequestContext.getCurrentinstance().update("form:dataTable:" + rowNumber + ":statusRepeatPanel")