加載指標頁面XPage中的全部刷新

我的XPage之一有許多設計元素。根據連接速度，頁面花費的時間比預期的多。我想創建一個指示器來顯示登錄用戶「頁面正在加載」...我做了部分刷新，它工作的很好，但我無法完成全面更新。我一直在尋找解決方案。我可以嘗試jquery，dojo或ajax。加載指標頁面XPage中的全部刷新

任何建議都很重要。 Regards C.A.

來源

2016-02-18 Cumhur Ata

我不認爲這是XPages特有的。你有什麼嘗試？這可能有助於您開始使用：https://www.google.com/#q=html+full+page+load+indicator –

我想在開始之前瞭解邏輯。 –

我現在已經做了一集NotesIn9，我相信它直接回答了這個問題。你可以在這裏找到它：http://www.notesin9.com/2016/02/19/notesin9-188-adding-a-please-wait-to-xpages/ –

我尚未作出專門NotesIn9顯示它但是，我在這個TLCC網絡研討會上做了一個技巧演示。
https://www.youtube.com/watch?v=jBaRSM9Ng_o&index=3&list=PL9nOJ-QrsuFa00dOsdE6EDh_l2fkiYD0D 相關部分從26分鐘左右開始。

我在加載頁面初始化時做了這一點，但如果您已經在頁面上，我肯定可以對其進行調整以進行全面更新。

基本概念是在頁面加載時，實際上並沒有加載任何長時間運行的數據。您剛發送頁面的外殼，然後在onClientLoad事件中觸發部分刷新。

<xp:this.resources> 
    <xp:script src="/xpUtilities.jss" clientSide="false"></xp:script> 
    <xp:dojoModule name="extlib.dijit.ExtLib"></xp:dojoModule> 
    <xp:dojoModule name="extlib.dijit.Loading"></xp:dojoModule> 
    <xp:styleSheet href="/app.css"></xp:styleSheet> 
</xp:this.resources> 
Page 1 


<xp:this.beforePageLoad><![CDATA[#{javascript:viewScope.put("vsHasData", false);}]]></xp:this.beforePageLoad> 
&#160;&#160;-&#160;&#160;Header UI goes here....<xp:br></xp:br> 
<xp:br></xp:br> 

<xp:br></xp:br> 

<xp:panel id="MainContentWrapper"> 
<xp:panel id="MainContent"> 

    <xp:this.rendered><![CDATA[#{javascript:return viewScope.get("vsHasData");}]]></xp:this.rendered> 
    <xp:br></xp:br> 

    <xp:repeat id="repeat1" rows="100" var="rowData" 
     indexVar="rowIdx"> 
     <xp:this.value><![CDATA[#{javascript:viewScope.get("vsStateMap").keySet()}]]></xp:this.value> 
     <xp:text escape="true" id="computedField2" 
      value="#{rowData}"> 
     </xp:text> 
     - 
     <xp:text escape="true" id="computedField3"> 
      <xp:this.value><![CDATA[#{javascript:viewScope.get("vsStateMap").get(rowData)}]]></xp:this.value> 
      <xp:this.converter> 
       <xp:convertNumber type="number" 
        integerOnly="true"> 
       </xp:convertNumber> 
      </xp:this.converter> 
     </xp:text> 
     <xp:br></xp:br> 
    </xp:repeat> 
    <xp:br></xp:br> 
    <xp:br></xp:br> 
</xp:panel> 
</xp:panel> 
<xp:eventHandler event="onClientLoad" submit="true" refreshMode="partial" refreshId="MainContentWrapper"> 
    <xp:this.action><![CDATA[#{javascript:return getStateTotals();}]]></xp:this.action> 
    <xp:this.onStart><![CDATA[XSP.startAjaxLoading("Calculating State Totals. This may take a few moments.")]]></xp:this.onStart> 
    <xp:this.onComplete><![CDATA[XSP.endAjaxLoading()]]></xp:this.onComplete> 
    <xp:this.onError><![CDATA[XSP.endAjaxLoading()]]></xp:this.onError> 
</xp:eventHandler>

這是一個演示頁。要看的東西是添加的dojo資源，事實上，我首先隱藏「MainContent」，然後結束onClientLoad位。

因此頁面加載，但生成重複控件的數據不會運行，因爲它位於非呈現面板中。所以用戶可以立即進入頁面。然後onClientLoad踢 - 開始它顯示一個「請稍候」類的東西，然後運行函數來獲取數據。當數據完成後，我設置了scopedVariable，然後顯示mainContent區域和endAjaxLoading東西，然後觸發並顯示所有內容。

來源

2016-02-18 12:50:08

一個偉大的解決方案，應該始終工作，除非重複repeatControls =「true」，在這種情況下，組件和數據源將在頁面加載時生成，而不管它們是否呈現。動態內容控件應該以相同的方式工作，甚至更好的是，甚至不會將任何子組件加載到組件樹中，直到要顯示相關方面。 –

你如何做到這一點不會是XPages特有的。瞭解事件的順序很重要。

用戶點擊鏈接的地方打開頁面
瀏覽器發送請求到服務器
服務器收到請求並加載組件樹頁服務器端
服務器運行beforePageLoad，afterPageLoad，beforeRenderResponse事件
服務器生成HTML發送到瀏覽器
服務器運行afterRenderResponse事件
服務器通過r esulting HTML屏幕
瀏覽器接收來自服務器

所以添加任何到處於第2步中的瀏覽器請求不能產生作用的目標的響應的XPage。在請求發送到瀏覽器之前，您需要在第1步中執行一些客戶端操作。如果您考慮如何爲部分刷新和發生了什麼做了這些工作，那麼它將在觸發部分刷新之前運行CSJS，同樣的過程。

如果用戶從外部來，唯一的選擇就是把它們先發送重定向網頁渲染，並繼續運行程序步驟1

來源

2016-02-18 09:20:59

加載指標頁面XPage中的全部刷新

回答

相關問題