ajax - 使用ajax切换图像渲染？

Question

如何根据按钮触发的布尔状态变量显示图像？我不希望整个页面重新加载，而只是那个特定的图像。

Facelets页面：

 </h:form>
    <h:commandButton value="test" action="#{bean.toggleStatus}">
        <f:ajax render="image"/>
    </h:commandButton>
    <h:graphicImage id="image" value="status.gif" rendered="#{bean.status}"/>
 </h:form>  

支持类：

    class Bean {

        private boolean status = false;

        public void toggleStatus() {
            status = true;
        }

        //getter, setter
    }

知道这里可能有什么问题吗？

Answer 1

您不能对未呈现到 HTML 端的 HTML 元素进行 ajax 更新。将其包装在始终呈现并更新它的组件中。

例如

<h:form>
    <h:commandButton value="test" action="#{bean.toggleStatus}">
        <f:ajax render="image"/>
    </h:commandButton>
    <h:panelGroup id="image">
        <h:graphicImage value="status.gif" rendered="#{bean.status}"/>
    </h:panelGroup>
</h:form>

也可以看看：

• 当我想对它进行 ajax 更新时，为什么需要在另一个组件中嵌套一个带有 render="#{some}" 的组件？