PrimeFaces inputText ajax event=valueChange 在命令按鈕點擊后觸發

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）中，不執行單擊先前渲染的按鈕（在更新之前）。

當我將更新表達式更改為選擇器時，我可以使它工作。 我的表達式更新了我需要更新的元素， 不包括按鈕。 就我而言：

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

請注意， change事件是輸入的默認值，因此我刪除了event="valueChange" 。

當然，您不需要使用選擇器。 您還可以只更新不包含按鈕的組件（如面板）：

<p:ajax update="yourPanel" />

此外， ajax="true"是p:commandButton默認值，因此您可以刪除它。

Answer 2

就我而言，我解決了同樣的問題，從我的頁面中刪除了以下語句：

<p:ajaxStatus onstart="PF('statusDialog').show()" onsuccess="PF('statusDialog').hide()"/>

不知何故，onstart 事件覆蓋了 click 事件，並且只處理了一個事件：change。