Question

我的XPages之一有很多设计元素。根据连接速度，页面加载的时间超过预期。我想创建一个指示器，以显示已登录的用户“页面正在加载”...我做了部分刷新，它工作得很好，但我无法完全刷新。我一直在寻找解决方案。我可以尝试jquery，dojo或ajax。

任何建议都很重要。问候 C.A。

Answer 1

我还没有为它做过专门的NotesIn9演出，但是我在这个TLCC网络研讨会上做了一个技术演示。
https://www.youtube.com/watch?v=jBaRSM9Ng_o&index=3&list=PL9nOJ-QrsuFa00dOsdE6EDh_l2fkiYD0D 相关部分在26分钟左右开始。

我在加载页面初始化时执行此操作，但如果您已经在页面上，我确信可以进行全面刷新。

基本概念是在页面加载时，您实际上并未加载任何长时间运行的数据。您刚刚发送了页面的shell，然后在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资源，我开始隐藏＆＃34; MainContent＆＃34;查看范围变量，然后结束onClientLoad位。

因此页面加载，但生成重复控件的数据不会运行，因为它在非渲染面板中。这样用户就可以立即访问该页面。然后onClientLoad踢 - 启动它显示＆＃34;请等待＆＃34;然后运行函数来获取数据。当数据完成后，我设置了一个scopedVariable然后显示mainContent区域，然后endAjaxLoading的东西会触发并显示所有内容。

Answer 2

如何执行此操作不会特定于XPage。了解事件的顺序非常重要。

用户点击链接某处以打开页面
浏览器向服务器发送请求
服务器接收请求并加载页面服务器端的组件树
服务器运行beforePageLoad，afterPageLoad，beforeRenderResponse events
服务器生成HTML以发送到浏览器
服务器运行afterRenderResponse事件
服务器将生成的HTML传递给屏幕
浏览器接收来自服务器的响应

因此，向步骤2中作为浏览器请求目标的XPage添加任何内容都无法生效。在将请求发送到浏览器之前，您需要在步骤1执行客户端操作。如果您考虑如何进行部分刷新以及发生了什么，再次在触发部分刷新之前运行CSJS，同样的过程。

如果用户来自外部，唯一的选择是首先将它们发送到重定向网页，进行渲染，然后以编程方式继续运行第1步。

在XPage中加载指标页面完全刷新

2 个答案: