Lor*_*ic- 3 jsf loading gif javabeans primefaces
在我的JSF/Primefaces项目中,我在bean的init(postconstruct)方法中加载了大量数据.这就是为什么我想在bean加载期间显示一个gif指示器.
我尝试使用primefaces和Ajax状态(展示的程序化版本)
http://www.primefaces.org/showcase/ui/ajaxStatusScript.jsf
Run Code Online (Sandbox Code Playgroud)
所以我把它添加到我的项目模板中
<p:dialog modal="true" widgetVar="loadWidget" header="Status"
draggable="false" closable="false">
<p:graphicImage value="../images/ajaxload.gif" />
</p:dialog>
Run Code Online (Sandbox Code Playgroud)
我希望能够loadWidget.show();在我的bean的init方法的开头调用,最后调用loadWidget.hide();.
你知道在哪里以及如何激活javascript以显示加载gif?谢谢
编辑
我可以补充说我试过这个.以下是我的模板中包含页面内容的部分.它不起作用p:对话框包含在内容之前或之后.
<div class="content">
<script>loadWidget.show();</script>
<ui:insert name="body" />
<script>loadWidget.hide();</script>
</div>
Run Code Online (Sandbox Code Playgroud)
控制台说 loadWidget is not defined
EDIT2
我将尝试解释我的项目是如何工作的.可能会有所帮助.
这是我的模板
<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>
Run Code Online (Sandbox Code Playgroud)
然后每个页面定义body.页面示例.
<html ... >
<ui:composition template="myTemplateAbove">
<ui:define name="body">
<h:outputText value="#{beanOfMyFirstPage.myText}" />
<p:commandButton action="#{beanOfMyFirstPage.goToAnotherPage}" />
...
</ui:define>
</ui:composition>
</html>
Run Code Online (Sandbox Code Playgroud)
然后每个页面都链接到一个扩展BaseBean的bean.
@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
}
Run Code Online (Sandbox Code Playgroud)
和普通豆
public class BaseBean {
@PostConstruct
public void init() {
super.init();
// General actions for all beans
}
}
Run Code Online (Sandbox Code Playgroud)
我有一个解决方案!
它非常简单,与primefaces或JSF bean构造过程无关.
我刚刚在我的模板中添加了这个(包含在每个页面中)
<div id="nonAjaxLoad">
<img src="../images/ajaxload.gif"/>
</div>
Run Code Online (Sandbox Code Playgroud)
然后我添加了下面的CSS,将其固定在页面的右下角
#nonAjaxLoad {
width: 50px;
height: 50px;
position: fixed;
bottom: 30px;
right: 30px;
}
Run Code Online (Sandbox Code Playgroud)
为了使它神奇,我添加了这个脚本
<script>
$(document).ready(function(){
$('#nonAjaxLoad').hide();
});
$(window).bind('beforeunload', function() {
$('#nonAjaxLoad').show();
});
</script>
Run Code Online (Sandbox Code Playgroud)
因此,当我离开页面时,会显示加载指示器,当加载另一页时,它会被隐藏.
感谢所有帮助@Andy的人
| 归档时间: |
|
| 查看次数: |
10173 次 |
| 最近记录: |