title: Disable submit button to prevent double click, but only upon successful form validation
body: <p>Currently my page has a submit button which is disabled when it is clicked, to prevent double submission.</p>
  
  <pre><code>&lt;tr:commandButton onclick="this.disabled=true;" /&gt;
  </code></pre>
  
  <p>However, if there are errors in the form, the user will not be able to re-submit the form since the submit button is disabled.</p>
  
  <p>Is there any way for me to disable the submit button only when it clears the form validation?</p>
  
  <p>FYI my page looks something like this:</p>
  
  <pre><code>&lt;rich:tabPanel headerAlignment="left" switchType="client" width="100%"&gt;
      &lt;rich:tab label="#{cfsMsgs.main_tab_label}" name="mainTab"&gt;
          &lt;rich:spacer height="20" /&gt;
          &lt;ui:include src="add_main.xhtml" /&gt;
      &lt;/rich:tab&gt;
      &lt;rich:tab label="#{cfsMsgs.qualification_tab_label}" name="qualificationTab"&gt;
          &lt;rich:spacer height="20" /&gt;
          &lt;ui:include src="add_qualification.xhtml" /&gt;
      &lt;/rich:tab&gt;
  
      &lt;!-- ...and so on... --&gt;
  </code></pre>
  
  <p>And on each tab there's a mix of validation methods like</p>
  
  <pre><code>&lt;tr:inputText ...&gt;
      &lt;tr:validateRegExp pattern="^\S.*" ... /&gt;
  &lt;/tr:inputText&gt;
  </code></pre>
  
  <p>...and</p>
  
  <pre><code>&lt;tr:inputText validator="#{backingBean.validate}" ...&gt;
  &lt;/tr:inputText&gt;
  </code></pre>
  
  <p>Is it possible to set my button to something like onclick="this.disabled=<strong><em>[page error indicator, e.g. page.hasError or something similar]</em></strong>"?</p>
  
  <p>EDIT 1:
  An alternative is to re-render the button if the page fails to submit. I made a change to my code as follows:</p>
  
  <pre><code>&lt;tr:commandButton onclick="this.disabled=true;" id="btnSubmit"&gt;
      &lt;a4j:support event="oncomplete" reRender="btnSubmit" ajaxSingle="true" oncomplete="alert('done!');" /&gt;
  &lt;/tr:commandButton&gt;
  </code></pre>
  
  <p>The oncomplete event in a4j:support is for me to see if it was done. However when I tried running this, I didn't see any alert. Does that mean I'm doing something wrong here?</p>