如何从 ap:dialog 中触发 ajax 事件

Question

因此，今天我大部分时间都在尝试在组件更改值时调用支持 bean 中的方法，这让我感到困惑。如果我的组件位于 之外，则一切正常，但是当嵌套在对话框内时，服务器端永远不会发生。最初我使用 控件，但注意到它也不适用于简单的 inputText。以下示例有效：

<h:panelGrid columns="3">
    <h:outputText value="Start"/>
    <p:inputText id="startOfRange" value="#{myBean.startRange}" valueChangeListener="#{myBean.startChanged}">
        <p:ajax event="change" update="play"/>
    </p:inputText>
    <h:outputText id="play" style="margin-left: 10px;" value="#{myBean.startRange}"/>
</h:panelGrid>

我的支持 bean 方法看起来像

public void startChanged(ValueChangeEvent event) { }

此方法是在 inputText 中的一个选项卡之后调用的，但是当像下面这样包装时，该方法永远不会被调用：

<p:dialog widgetVar="efDlg" zindex="10" appendToBody="true" header="Create Custom Date Range"
      modal="true" height="375" width="450" resizable="false" closable="false" >
<h:panelGrid columns="4">
    <h:outputText value="Start"/>
    <p:inputText id="startOfRange" value="#{myBean.startRange}" valueChangeListener="#{myBean.startChanged}">
        <p:ajax event="change" update="play"/>
    </p:inputText>
    <h:outputText id="play" style="margin-left: 10px;" value="#{myBean.startRange}"/>
    <p:inputText id="endOfRange" value="#{myBean.endRange}" valueChangeListener="#{myBean.endChanged}"/>
</h:panelGrid>
<div class="customRangeButtons">
    <span>
        <p:commandButton value="Cancel" onstart="efDlg.hide();" actionListener="#{myBean.cancelCustomDateRange}" update="pGraphs"/>
    </span>
    <span style="margin-left: 300px;">
        <p:commandButton  value="Ok" type="submit" onstart="efDlg.hide();" action="#{myBean.saveCustomDateRange()}" update="pGraphs"/>
    </span>
</div>    
</p:dialog>

注意我正在使用 Primefaces 2.2.1 和 Mojarra 2.1.0。关于为什么我无法在值更改时调用 startChanged 方法的任何想法？

Answer 1

也许我对此是错的（我家里没有我的项目代码来验证），但这不是：

<p:ajax event="change" update="play"/>

应该是：

<p:ajax event="valueChange" update="play"/>

我知道大多数 Ajax event 值就像JavaScript 事件处理程序删除了“on”，但 valueChange 是 JSF Ajax 标记中的特殊值。

作为记录，我有时会在 inputText 中配对两个 Ajax 子标签，例如：

<p:ajax event="valueChange" process="@this" update="whatever"/>
<p:ajax event="keyUp" process="@this" update="whatever"/>

这将处理输入时的每个击键以及复制粘贴和失去对父输入文本的焦点。

Answer 2

我也遇到过同样的问题。我还使用单个表单，并且对话框内没有表单。只要我的对话框没有appendToBody =“true”，输入值和ajax并提交就会正确发生。一旦我将该属性添加为 true，为了更好/正确的渲染，输入值将不被接受。