Bean初始化期间的jsf/primefaces加载指示器 [英] jsf/primefaces load indicator during init of the bean
问题描述
在我的JSF/Primefaces项目中,我的bean的init(postconstruct)方法中加载了很多数据.这就是为什么我想在Bean加载期间显示gif指示器.
In my JSF/Primefaces project, I have a lot of data loading in the init (postconstruct) method of my beans. That's why I would like to show an gif indicator during the bean load.
我尝试使用素数和Ajax状态(展示柜的编程版本)
I tried with primefaces and the Ajax status (programmatic version of the showcase)
http://www.primefaces.org/showcase/ui/ajaxStatusScript.jsf
所以我将其添加到了项目模板中
So I added this to the template of my project
<p:dialog modal="true" widgetVar="loadWidget" header="Status"
draggable="false" closable="false">
<p:graphicImage value="../images/ajaxload.gif" />
</p:dialog>
我希望能够在bean的init方法的开始处调用loadWidget.show();
,并在结束时调用loadWidget.hide();
.
I would like to be able to call loadWidget.show();
at the beginning of the init method of my bean and loadWidget.hide();
at the end.
您是否知道在何处以及如何触发javascript以显示加载的gif? 谢谢
Do you have an idea where and how to fire the javascript to display the loading gif? Thanks
编辑
我可以补充一点,我尝试了这个.这是模板的一部分,其中包含页面的内容.在内容之前或之后包含p:dialog均不起作用.
I could add that I tried this. Here is the part of my template that include the content of the page. It's not working either the p:dialog is included before or after the content.
<div class="content">
<script>loadWidget.show();</script>
<ui:insert name="body" />
<script>loadWidget.hide();</script>
</div>
控制台显示loadWidget is not defined
EDIT2
我将尝试解释我的项目如何运作.可能会有帮助.
I will try to explain how my project works. Could be helpful.
这是我的模板
<html ... >
<f:view contentType="text/html">
<h:head> ... </head>
<h:body>
<ui:insert name="header" />
<ui:insert name="menu" />
<ui:insert name="body" />
<ui:insert name="footer" />
... <!-- Other things -->
</h:body>
</f:view>
</html>
然后每个页面定义body
.页面示例.
Then each page defines the body
. Example of a page.
<html ... >
<ui:composition template="myTemplateAbove">
<ui:define name="body">
<h:outputText value="#{beanOfMyFirstPage.myText}" />
<p:commandButton action="#{beanOfMyFirstPage.goToAnotherPage}" />
...
</ui:define>
</ui:composition>
</html>
然后,每个页面都链接到扩展BaseBean的bean.
Then each page is linked to a bean that extends a BaseBean.
@ManagedBean(name = "beanOfMyFirstPage")
@ViewScoped
public class beanOfMyFirstPage extends BaseBean {
// attributes + getters and setters
@PostConstruct
public void init() {
super.init();
... // actions that take time cause of DB requests for example
}
public void goToAnotherPage() {
navigation.handleNavigation(FacesContext.getCurrentInstance(), null, "mySecondPage");
}
// methods
}
还有普通的豆子
public class BaseBean {
@PostConstruct
public void init() {
super.init();
// General actions for all beans
}
}
推荐答案
我有解决方法!
这非常简单,与素数或JSF bean的构建过程无关.
It was very simple and there is nothing to do with primefaces or with the JSF bean construction process.
我刚刚将其添加到了模板中(每个页面都包含了该模板)
I just added this in my template (that is included for every pages)
<div id="nonAjaxLoad">
<img src="../images/ajaxload.gif"/>
</div>
然后我在下面添加了CSS,将其固定在页面的右下角
Then I added the css below to move it fixed to the bottom right of the page
#nonAjaxLoad {
width: 50px;
height: 50px;
position: fixed;
bottom: 30px;
right: 30px;
}
为了使它变得神奇,我添加了此脚本
And to make it magical, I added this script
<script>
$(document).ready(function(){
$('#nonAjaxLoad').hide();
});
$(window).bind('beforeunload', function() {
$('#nonAjaxLoad').show();
});
</script>
因此,当我离开页面时,会显示正在加载的指示符,而在另一页面加载时,它会被隐藏.
So when I leave the page, the loading indicator is shown and when the other page is loaded, it's hidden.
感谢所有为@Andy提供帮助的人
Thanks to everyone that helped especially @Andy
这篇关于Bean初始化期间的jsf/primefaces加载指示器的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!