我有一个艰难的时间与网格JSF, AJAX和JavaScript。下面是我要做的:
当用户提交表单时,他们被引导到一个新页面。该页面最初检查他们的提交是否已被处理,如果没有,则显示一个进度条(参见Twitter Bootstrap)。然后,我使用f:ajax来检查它是否已完成处理。调用waitForProcessing方法;它只是等待,直到processing设置为true,然后返回true。此时,ajax应该调用JavaScript将进度条设置为不可见,然后更新页面。下面是代码:
<ui:define name="content">
<c:choose>
<c:when test="#{not submission.isIsProcessed}">
<f:ajax onevent="setVisibility('processing-dialog', 'none'); setVisibility('processing-backdrop', 'none');" listener="#{submission.waitForProcessing}" status="success" />
<div class="modal-backdrop fade in" id="processing-backdrop"></div>
<div id="processing-dialog" class="modal hide fade in" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="false" style="display: block;">
<div class="modal-header">
<h3 id="myModalLabel">One sec...</h3>
</div>
<div class="modal-body">
<p>We are compiling and running your code!</p>
<div class="progress progress-striped active">
<div class="bar" style="width: 40%;"></div>
</div>
</div>
</div>
</c:when>
</c:choose>
.......
.......
这里有很多东西不起作用。首先,f:ajax抛出一个异常,因为显然f:ajax只能嵌套在某些组件中。有更好的方法吗?目标是显示一个进度条,直到后端处理完成。这个处理过程可能需要几分钟,这就是为什么我在数据准备好之前不让页面自行加载的原因。
您的问题是f:ajax只执行一次。如果你想多次执行相同的ajax调用,你应该使用poll组件,该组件只能在框架中作为PrimeFaces、RichFaces和其他组件使用。RichFaces有一个与您描述的完全一样的组件(它在内部使用轮询)。你可以在这里查看:RichFaces进度条。