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

Question

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

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

在同一个表单中是一个命令按钮：

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

当我

1. 更改 inputText 字段，
2. 然后单击命令按钮以外的位置
3. 点击命令按钮

一切都按预期工作。但是如果我：

1. 更改 inputText 字段，
2. 立即命令按钮

该按钮没有被触发，因为第一次单击 commandButton 触发了在 inputText 字段中发生的 valueChange 事件。

如果我再次单击它，按钮操作最终会发生。

现在，如果我将 p:ajax event="valueChange" 更改为 p:ajax event="keyup"，第一次单击 commandButton 会按预期工作，但不幸的是 inputField 上的 keyup 事件非常麻烦，并且您在该字段中失去了功能（复制/粘贴文本，文本选择、“快速”输入等）

关于如何在 inputText 字段中启动更改事件，并在用户在 inputText 字段中键入后立即单击按钮时触发 commandButton 操作有什么想法吗？

感谢您的宝贵时间！

Answer 1

首先触发您的valueChange。这会更新包括按钮的表单。不能 100% 确定这是否与浏览器相关，但在 Chromium (Linux) 中，不会执行单击先前呈现的按钮（在更新之前）。

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

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

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

当然你不需要使用选择器。您也可以只更新不包含按钮的组件（如面板）：

<p:ajax update="yourPanel" />

另外，ajax="true" 是 p:commandButton 的默认值，因此您可以删除它。