PrimeFaces inputText ajax event=valueChange fires AFTER commandButton clicked

Question

Using JSF and PrimeFaces 6.1 I have an inputText field as such:

Answer 1

First your valueChange is triggered. This updates the form including the button. Not 100% sure if this is browser dependent, but in Chromium (Linux), the click on the previously rendered button (before it has been updated) is not executed.

I could get it working when I changed the update expression into a selector. My expression updates the elements I needed to be updated excluding the button(s). In my case:

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

Note that the change event is default for inputs, so I've removed event="valueChange".

Of course you do not need to use a selector. You can also just update a component (like a panel) which does not contain the button:

<p:ajax update="yourPanel" />

Also, ajax="true" is default for a p:commandButton, so you can remove that.