在处理JSF时禁用按钮并显示加载图像

时间:2012-06-05 16:09:42

标签: jsf richfaces loading-image

我的webapp中有这个模块,我需要更新目录。

我们的想法是停用 h:commandButton显示 a h:graphicImage,这两项操作都应该在点击按钮后立即发生。 最后,当更新过程结束时,它应该采取另一种方式,隐藏 h:graphicImage启用 h:commandButton,但这次也显示了标签h:outputText,表示“更新成功”或“更新失败”。

我的代码中的问题是图像和标签在处理完成后就出现了,我找不到上面描述的方法。

我遗失的地方或内容是什么?,

干杯。

    <a4j:commandButton id="btnActualiza" value="Actualizar catálogos"
                       render="messageCatalogos actualizacionCorrecta
                       @this imgProcesando"
                       onclick="this.disabled=true;"
                       oncomplete="this.disabled=false"
                       actionListener="#{administrationBean.doImgProcesandoVisible}"
                       action="#{administrationBean.doActualizaCatalogos}"/>
    <a4j:outputPanel id="imgProcesando">
        <h:graphicImage rendered="#{administrationBean.imgProcesandoRendered}"
                        url="img/imgLoading.gif"/>
    </a4j:outputPanel>
    <h:panelGroup/>
    <h:panelGroup/>
    <a4j:outputPanel id="actualizacionCorrecta" style="font-size: 14px; color: #D17100">
        <h:outputText rendered="#{administrationBean.actualizacionCorrectaLabelRendered}"
                      value="Actualización correcta !"/>
        <h:outputText rendered="#{administrationBean.actualizacionFalloLabelRendered}"
                      value="Fallo la actualización !"/>
    </a4j:outputPanel>

更新

我的开发环境:

  • Mojarra 2.1.6
  • RichFaces 4.1.0.Final
  • Tomcat 7.0.14(测试)/ Tomcat 7.0.22(prod)

1 个答案:

答案 0 :(得分:3)

您需要通过JS显示和隐藏图像。

<h:graphicImage id="loading" url="img/imgLoading.gif" style="display:none" />

<a4j:commandButton ...
    onbegin="this.disabled=true; $('#formId\\:loading').show()"
    oncomplete="this.disabled=false; $('#formId\\:loading').hide()"
/>