JSF延迟加载组件值

Question

考虑一个简单的h:outputText组件:

<h:outputText value="#{myBean.myValue}"/>

如何在页面渲染后延迟加载该值,并在完成此操作时显示自定义'ajax loading'图标而不是值？

我在我的项目中使用PrimeFaces 3.5,因此欢迎任何特定于PF的实现.

Answer 1

建议通过remoteCommand在页面加载后调用(通过将autoRun属性设置为true 来完成)并更新您的outputText.

private String myValue;

// getter and setter

public void initMyValue() {
  // init myValue
}

在页面上,您应该有ajaxStatus用于查看加载图像的组件,以及您的outputText.还应该有p:remoteCommand组件:

<p:ajaxStatus style="width:16px;height:16px;" id="ajaxStatusPanel">  
  <f:facet name="start">  
    <h:graphicImage value="ajaxloading.gif" />  
  </f:facet>
  <f:facet name="complete">  
    <h:outputText value="" />
  </f:facet>  
</p:ajaxStatus>

<h:outputText id="myText" value="#{myBean.myValue}"/>

<p:remoteCommand autoRun="true" actionListener="#{myBean.initMyValue}" update="myText"/>

编辑:我认为你想要延迟加载值,outputText因为它包含一些长时间运行的计算,但如果你想完全在你的支持bean中渲染outputText第一个添加boolean属性,并true在initMyValue方法结束时将此属性设置为:

private boolean loaded;

// getter and setter

public void initMyValue() {
  // init myValue
  loaded = true;
}

在页面上重新组织如下:

<h:panelGroup id="myPanel" layout="block">
  <h:graphicImage value="ajaxloading.gif" rendered="#{!myBean.loaded}"/>
  <h:outputText value="#{myBean.myValue}" rendered="#{myBean.loaded}"/>
</h:panelGroup>

<p:remoteCommand autoRun="true" actionListener="#{myBean.initMyValue}" update="myPanel"/>