JSF 延迟加载组件值 [英] JSF lazy loading component value

问题描述

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

Consider a simple h:outputText component:

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

如何在页面呈现后延迟加载该值，并在完成此操作时显示自定义的ajax 加载"图标而不是该值?

How can I lazy load that value after the page has been rendered, and display custom 'ajax loading' icon instead of the value while this is being done?

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

I am using PrimeFaces 3.5 in my project so any PF-specific implementation will be welcome.

推荐答案

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

A suggest to do this by calling remoteCommand after on page load (it is done by setting autoRun attribute to true) and update your outputText.

private String myValue;

// getter and setter

public void initMyValue() {
  // init myValue
}

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

On page you should have ajaxStatus component for viewing loading image, and your outputText. Also there should be p:remoteCommand component:

<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 的值，因为它包含一些长时间运行的计算，但是如果您想完全延迟 的呈现outputText 首先在你的支持 bean 中添加 boolean 属性，并在 initMyValue 方法的末尾将此属性设置为 true:

I supposed that you want to lazy load value of outputText because it contains some long running calculations, but if you want to completely deffer rendering of outputText first add boolean property in your backing bean, and set this property to true at the end of initMyValue method:

private boolean loaded;

// getter and setter

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

在页面上重新组织如下:

on the page reorganize it as follows:

<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"/>

这篇关于JSF 延迟加载组件值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！