Action of JSF h:commandButton not invoked after setting disabled=true in JavaScript

Question

Who can explain the following behaviour? When disabling a command button in JavaScript, the action method is never executed.

<h:form>
    <h:commandButton value="test" action="#{bean.test}" onclick="disabled=true" />
</h:form>

Answer 1

When a HTML form element is disabled, then its name=value pair won't be sent as HTTP request parameter and hence JSF will never find it in the request parameter map. For command buttons this in turn means that the action is never invoked.

You need to disable the button shortly after the form has been submitted. The proposed suggestions to use disabled attribute make no sense as it's too late. It's not set during submitting the form, but it's only set when the response returns.

To achieve your particular functional requirement in this particular case, you could use JS to timeout the disablement.

<h:commandButton ... onclick="setTimeout('document.getElementById(\'' + this.id + '\').disabled=true;', 50);" />

Much better is however to use <f:ajax onevent>

See also:

• Pure Java/JSF implementation for double submit prevention
• Reload parts of a page before action is executed?