Primefaces blockUI AJAX更新后停止工作 [英] Primefaces blockUI stops working after ajax update

问题描述

我想创建一个显示blockUI时，它正忙于一个数据表，我已大多成功。现在变灰，并显示正在加载...每当我单击任一两个命令，排序的数据表通过点击标题或页面通过数据表。你可以看到code为它下面。

现在的问题是，在我使用了CommandButton控件之一（运行阻塞元素的AJAX的更新），后续操作不触发blockUI（直到我刷新页面）。例如：

• 加载页
• 单击一个数据表头 - blockUI出现，直到表整理完
• 点击的数据表页面导航按钮之一 - blockUI，直到出现页面加载
• 点击CommandButton控件之一 - blockUI出现，直到按钮的ActionListener的已完成
• 单击一个数据表头 - 表排序，但blockUI没有出现
。
• 点击的数据表页面导航按钮之一 - 页面加载，但blockUI没有出现
• 点击CommandButton控件之一 - ActionListener的奔跑和表更新，但blockUI没有出现
• 刷新页面 - 一切工作正常再

更改CommandButton控件'更新=属性阿贾克斯=假导致排序/分页始终显示blockUI，但CommandButton控件从不显示blockUI。

任何想法？

 ＆LT; D​​IV CLASS =buttonDiv＆GT;
    ＆LT;电话号码：的commandButton ...更新=resultsPanelID =提交按钮... /＆GT;
    ...
    ＆LT;电话号码：的commandButton ...更新=resultsPanelID =resetScenarioButton... /＆GT;
＆LT; / DIV＆GT;
＆LT;电话号码：面板标题=结果网格ID =resultsPanel＆GT;
    ...
    ＆LT;电话号码：dataTable的... ID =VAResults...＆GT;
        ...
    ＆LT; / P：dataTable的＆GT;
    ....
＆LT; / P：面板＆gt;
＆LT;电话号码：blockUI块=resultsPanel触发=提交按钮，resetScenarioButton，VAResults＆GT;
    载入中...
＆LT; / P：blockUI＆GT;
 

解决方案

在触发属性上指定的元素结合jQuery的听众。但是，如果你更新的元素绑定丢失。我不知道，如果它的工作原理，但你可以尝试移动＆LT;电话号码：blockUI 的 resultsPanel 里面。我怀疑，当你更新面板blockUI被更新过，因而重新结合听众的数据表。

 ＆LT;电话号码：面板标题=结果网格ID =resultsPanel＆GT;
    ...
    ＆LT;电话号码：dataTable的... ID =VAResults...＆GT;
        ...
    ＆LT; / P：dataTable的＆GT;
    ....
    ＆LT;电话号码：blockUI块=resultsPanel触发=提交按钮，resetScenarioButton，VAResults＆GT;
    载入中...
＆LT; / P：blockUI＆GT;
＆LT; / P：面板＆gt;
 

I am trying to create a datatable that displays a blockUI whenever it is busy, and I have been mostly successful. It now grays out and shows "Loading..." whenever I click either of two commandButtons, sort the datatable by clicking on a header, or page through the datatable. You can see the code for it below.

The problem is that after I have used one of the commandButtons (which runs an ajax update on the blocked element), subsequent actions do not trigger the blockUI (until I refresh the page). For example:

• Load page
• Click a datatable header - blockUI appears until table is finished sorting
• Click one of the datatable page navigation buttons - blockUI appears until the page is loaded
• Click one of the commandButtons - blockUI appears until the button's actionListener has finished
• Click a datatable header - table sorts, but blockUI does not appear.
• Click one of the datatable page navigation buttons - page loads, but blockUI does not appear
• Click one of the commandButtons - actionListener runs and table updates, but blockUI does not appear
• Reload the page - everything works properly again

Changing the commandButtons' update="" attribute to ajax="false" causes the sorting/paging to always display the blockUI, but the commandButtons to never display the blockUI.

Any ideas?

<div class="buttonDiv">
    <p:commandButton ... update="resultsPanel" id="submitButton" ... />
    ...
    <p:commandButton ... update="resultsPanel" id="resetScenarioButton" ... />
</div>
<p:panel header="Results Grid" id="resultsPanel">
    ...
    <p:dataTable ... id="VAResults" ... >
        ...
    </p:dataTable>
    ....
</p:panel>
<p:blockUI block="resultsPanel" trigger="submitButton, resetScenarioButton, VAResults">
    Loading...
</p:blockUI>

解决方案

The trigger attribute binds jQuery listeners on the specified elements. However if you update an element the binding gets lost. I don't know if it works, but you could try moving the <p:blockUI inside the resultsPanel. I suspect that when you update the panel the blockUI gets updated too and thus re-binding the listener to the data table.

<p:panel header="Results Grid" id="resultsPanel">
    ...
    <p:dataTable ... id="VAResults" ... >
        ...
    </p:dataTable>
    ....
    <p:blockUI block="resultsPanel" trigger="submitButton, resetScenarioButton, VAResults">
    Loading...
</p:blockUI>
</p:panel>

这篇关于Primefaces blockUI AJAX更新后停止工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！