Question

I have a <h:commandButton> in my XHTML page. I want the button to be disabled as soon as I click the button. Then the button should call the action. My button gets disabled as I expect but the problem is that the action is not fired.

<h:commandButton value="Go" onclick="this.disabled=true" action="#{bean.go()}"/>

But if I remove the onclick attribute the action is fired.

Or if I used an <a4j:commandButton> it works.
Following a4j button works.

<a4j:commandButton value="Go" onclick="this.disabled=true" action="#{bean.go()}"/>

How can I disable a <h:commandButton> after being clicked, so that the action still fires?

Answer 1

Use setTimeout , that way the action will be fired and the button will be disabled…

<h:commandButton value="Go"
   onclick="setTimeout('this.disabled = true;', 50);" 
   action="#{bean.go()}"/>

You can also take a look at the following question too :How can I disable an h:commandButton without preventing the action and actionListener from being called?