PrimeFaces inputText ajax event = valueChange在单击commandButton后触发

时间:2017-05-03 00:25:02

标签: ajax jsf primefaces jsf-2

使用JSF和PrimeFaces 6.1我有一个inputText字段:

<p:inputText value="#{backingBean.stringField}">
    <p:ajax event="valueChange" update="@form" />
</p:inputText>

并且在同一个表单中是commandButton:

<p:commandButton id="btnDoThatThing" 
                 ajax="true" 
                 immediate="true"
                 update="@form"
                 process="@this"
                 action="#{backingBean.doThatThing}"/>

当我

  1. 对inputText字段进行更改
  2. 然后单击“命令按钮以外的其他地方”
  3. 单击命令按钮
  4. 一切都按预期完成。但如果我:

    1. 对inputText字段进行更改
    2. 立即执行命令按钮
    3. 按钮未被触发,因为第一次单击commandButton会触发inputText字段中发生的valueChange事件。

      如果我第二次点击它,按钮动作最终会发生。

      现在,如果我将p:ajax event="valueChange"更改为p:ajax event="keyup",那么第一次按下commandButton会按预期工作,但不幸的是,inputField上的keyup事件很糟糕,你在该字段中失去了功能(复制/粘贴文字,文字选择,快速键入&#39;等等)

      有关如何在inputText字段中启动change事件的任何想法,当用户在inputText字段中输入时立即单击按钮时触发commandButton操作?

      谢谢你的时间!

1 个答案:

答案 0 :(得分:6)

首先触发你的valueChange。这会更新表单按钮。不是100%确定这是否依赖浏览器,但在Chromium(Linux)中,未执行点击之前渲染的按钮(在更新之前)。

当我将更新表达式更改为selector时,我可以将其工作。我的表达式更新了我需要更新的元素不包括按钮。就我而言:

<p:ajax update="@(form :input:not(button))" />

请注意,change事件是输入的默认值,因此我删除了event="valueChange"

当然,您不需要使用选择器。您也可以只更新不包含按钮的组件(如面板):

<p:ajax update="yourPanel" />

此外,ajax="true"p:commandButton的默认设置,因此您可以将其删除。