Prime Faces：如何從頁面A導航到（慢）頁面B，並顯示進度「正在加載...」指標

Question

我正在使用Prime Faces（JSF UI庫）。

我想從頁面A導航到頁面B，但是由於頁面B速度較慢，因此需要一些時間來加載。

我該怎麼做？

Answer 1

爲此，您可以對網頁B添加AJAX裝載第B你有這樣的事情：

<h:head> 
    <script type="text/javascript"> 
    function onLoadCallback(data) { 
     if (data.status == "begin") { 
     dialogWidget.show(); 
     } else { 
     dialogWidget.hide(); 
     } 
    } 
    </script> 
</h:head> 
<h:body> 
    <f:ajax event="load" listener="#{bean.onload}" onevent="onLoadCallback" render=":include1"/> 

    <h:panelGroup id="include1"> 
    <h:panelGroup id="include2" rendered="#{bean.loaded}"> 
     <ui:include src="realPageB.xhtml"/> 
    </h:panelGroup> 
    </h:panelGroup> 

    <p:dialogid="dialog" widgetVar="dialogWidget" modal="true"> 
    Loading 
    </p:dialog> 
</h:body> 

有了這個，你用AJAX（速度快），最初只裝載頁面，你叫方法更新面板哪些組實際頁面。在加載過程中，您將看到模態對話框（您也可以使用p:ajaxStatus進行試驗）。在豆initali loaded是假的，之後onload方法被稱爲更新loaded爲true：

private loaded; 

// getters and setters 

public void onload(AjaxBehaviourEvent event) { 
    loaded = true; 
}