AJAX 通知托管 bean 迭代表单的哪一行是焦点

Question

我有一个 PrimeFaces p:accordionPanel，每个选项卡中都有一个表格：

<p:accordionPanel id="iterator" value="#{myManagedBean.itemList}" var="item" multiple="false">

    <p:tab title="#{item.name}">

        <h:form prependid="true">

            <h:outputLabel for="field1" value="Field 1:"/>
            <p:inputText id="field1" title="Field 1" value="#{item.field1}" />

            <h:outputLabel for="field2" value="Field 12:"/>
            <p:inputText id="field2" title="Field 2" value="#{item.field2}" />

我认为它是一个 PrimeFaces accordionPanel 是无关紧要的，如果它是一个普通的 JSF h:dataTable，每行都有一个表单，那么行为将是相同的。

我想做的（没有详细解释原因）是，一旦在迭代器（accordionPanel、dataTable，任何在 List 上循环的迭代）中设置了用户焦点（光标），通过 AJAX 通知托管 bean 我当前所在的实体（项目）是什么。因此，如果有 20 行，因此重复表单的数量，每个代表一个 item，如上面的代码所示，当我将焦点放在一行的表单上时，我想在托管 bean setActiveEntity 中触发一个 setter ，它将指向实体或其 ID，以标识我所在的行.

Answer 1

如果您有 multiple="false"（如您的情况），则可以根据需要将正常的 PrimeFaces Accordion ajax events 与 activeIndex 属性结合使用。由于只会打开一个tab，所以可以在打开时的事件中获取到实际的tab(name, index))

bean 中的方法：

public void onTabChange(TabChangeEvent event) {
    FacesMessage msg = new FacesMessage("Tab Changed", "Active Tab: " + event.getTab().getTitle());
    FacesContext.getCurrentInstance().addMessage(null, msg);
}

public void onTabClose(TabCloseEvent event) {
    FacesMessage msg = new FacesMessage("Tab Closed", "Closed tab: " + event.getTab().getTitle());
    FacesContext.getCurrentInstance().addMessage(null, msg);
}

xhtml 片段：

<p:accordionPanel>
    <p:ajax event="tabChange" listener="#{tabbedView.onTabChange}" update=":form:msgs" />
    <p:ajax event="tabClose" listener="#{tabbedView.onTabClose}" update=":form:msgs" />
...

如果你有multiple="true"，你可以从ajax事件中得到开始和结束，但你永远不知道什么是一个用户正在积极做事的人。然后将 ajax 事件处理程序添加到您的输入中，在 ajax 事件中您可以获得作为事件源的组件的客户端 ID。此 clientId 将包含源组件所在行的 'index'。它类似于：

iterator:1:field1

所以像

这样的事件处理程序

public void myMethod(AjaxBehaviorEvent event){
    String clientId = ((UIComponentBase))event.getSource()).getClientId();
    // some creative string parsing here
}

会在 ajax 活动中给你 'index'。 ajax 标签可以是

<p:ajax event="change" listener="#{myBean.myMethod}" />

事件可以由您选择的内容填充（另请参阅 What values can I pass to the event attribute of the f:ajax tag?）

一个更复杂的解决方案包括在普通 html 元素上注册 jquery 事件处理程序，并在单击某行时使用 PrimeFaces remoteCommand 调用 backingbean。但是您可以检查 h:form 是否接受 ajax 标签中的 onclick 事件

<h:form>
    <f:ajax event="click" listener="#{myBean.myMethod}" />
...

您仍然需要如上所述检索 'index'

AJAX 通知托管 bean 迭代表单的哪一行是焦点

AJAX notifying managed bean what row of iterating form is focused

ajax

jsf

accordion

primefaces