单击后禁用 a4j:commandButton

Question

我有一个 a4j 命令按钮，它使用 a4j:status onstart 和 onstop 事件在弹出面板中显示加载程序。与 a4j:commandButton 链接的操作方法完成后，我希望按钮在屏幕上显示为禁用。

我在 disableBtn 的支持 bean 中创建了一个布尔变量，它在 a4j 命令按钮的操作方法中被设置为 true。当我渲染按钮时，包含加载程序的弹出窗口不会消失

<h:form>
    <a4j:status id="waitingMessage"
     onstart="#{rich:component('modalPanelId')}.show()"
     onstop="#{rich:component('modalPanelId')}.hide()">
    </a4j:status>

    <rich:popupPanel id="modalPanelId" modal="true"
    autosized="true">
    <h:graphicImage library="images" name="loading.gif" />
    </rich:popupPanel>

    <rich:panel id="updatePanel">                                                                                                                   
    <div>
         <a4j:commandButton value="Confirm Action"
         styleClass="btn right" 
         disabled="#{bean.disableBtn}"
         actionListener="#{bean.confirmAction}"
         execute="@this" render="updatePanel"
         immediate="true" />

    </div>
    </rich:panel>


</h:form>

带有加载程序的弹出面板应在 a4j:commandButton 操作完成后消失，并且按钮应呈现为禁用状态。

Answer 1

动作源无法自行禁用（我不记得这是 JSF 的东西还是只是 RichFaces）。操作完成后，您必须让另一个组件禁用并重新呈现按钮作为响应，简单的 a4j:jsFunction 应该可以。类似于：

<a4j:jsFunction name="setEnabled" render="button">
  <a4j:param name="enabled" assignTo="#{bean.buttonEnabled}"/>
</a4j:jsFunction>

<a4j:commandButton … oncomplete="setEnabled(false)" />

Answer 2

可以使用纯 JavaScript onclick 处理程序禁用元素：

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

单击后禁用 a4j:commandButton

Disabling an a4j:commandButton after click

jsf

richfaces