如何在p:对话框中触发ajax事件

时间:2011-08-04 00:34:04

标签: jsf-2 primefaces

所以我今天大部分时间都在努力在组件更改值时调用我的支持bean中的方法。如果我的组件在<p:dialog>之外,一切都能正常工作,但是当嵌套在对话框中时,服务器端永远不会发生。最初我正在使用<p:calendar>控件,但发现它也不适用于简单的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中输出tab之后调用此方法,但是当像下面这样包装时,永远不会调用该方法:

<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方法?

2 个答案:

答案 0 :(得分:2)

也许我对此错了(我家里没有我的项目代码来验证)但不是这样:

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

应该是:

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

我知道大多数Ajax event值都类似于删除了'on'的JavaScript事件处理程序,但valueChange是JSF Ajax标记中的特殊值。

为了记录,我有时会在inputText中配对两个Ajax子标记,例如:

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

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

答案 1 :(得分:0)

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

相关问题