从链接执行待机对话框

Question

这是我所拥有的：Xpages 页面，它根据 url 参数按键填写表单。渲染最多可能需要 10 秒，我想让用户知道表单正在执行某些操作。

Fredrik Norling 做了一个很棒的待机对话框，当我在按钮上使用它时效果很好（保存） http://openntf.org/XSnippets.nsf/snippet.xsp?id=standby-dialog-custom-control （保存时在表单上使用部分 ID 更新）

如何通过电子邮件中的链接执行此脚本块？ 有诸如 beforepageload 、 afturpageload 之类的选项，或者我应该使用 beforeRenderResponse 如果是这样，我该怎么做。

Answer 1

在做了一些实验之后，看起来你很难完成你想做的事情。您上面引用的事件都是服务器端事件，因此无法与用户客户端进行通信。 view.postScript 也不适用。

问题是（我假设）您的所有逻辑都在页面加载之前完成。因此，我认为实现这一点的唯一方法是延迟逻辑处理，直到页面加载后进行部分刷新。

您可以通过将所有逻辑移动到自定义控件，将该自定义控件添加到面板，然后在 XPage 的 onClientLoad 事件中，对面板进行部分刷新，这将触发待机功能自动地。

我模拟了一个我正在谈论的例子：

Xpage 代码

<xp:this.beforePageLoad><![CDATA[#{javascript:viewScope.showLogic = false}]]></xp:this.beforePageLoad>
<xp:panel id="panelLogic">
    <xc:logic id="logic"
        rendered="#{javascript:viewScope.showLogic == true;}">
    </xc:logic>
</xp:panel>
<xp:br></xp:br>
<xp:br></xp:br>


<xc:standby></xc:standby>


<xp:eventHandler event="onClientLoad" submit="true"
    refreshMode="partial" refreshId="panelLogic">
    <xp:this.action><![CDATA[#{javascript:viewScope.showLogic = true;}]]></xp:this.action>
</xp:eventHandler>
</xp:view>

上述代码的关键部分是在页面加载时将 viewScope 变量设置为“false”，然后在部分刷新之前将其设置为“true”。将其设置为 true 会取消隐藏逻辑自定义控件并允许其正常处理。

逻辑自定义控件

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core">

    <xp:text escape="true" id="computedField1">
        <xp:this.value><![CDATA[#{javascript:for (x=0;x<100000000;x++) {

}}]]></xp:this.value>
    </xp:text>
</xp:view>

我怀疑可能有更好的方法来做到这一点，但这种方法效果很好。

Answer 2

我会将 XPage 加载为空，并在页面的 onload 事件中单击一个隐藏按钮。 此按钮将执行一些服务器端 SSJS，这些 SSJS 将显示您要显示的控件。然后 Standby 小部件将负责其余的工作。用户将获得等待对话框。

 <xp:view xmlns:xp="http://www.ibm.com/xsp/core"
    xmlns:xc="http://www.ibm.com/xsp/custom">

    <xp:button value="Clickme" id="LoadWait"
        style="visibility:hidden;display:none">
        <xp:eventHandler event="onclick" submit="true"
            refreshMode="partial" refreshId="MainContent">
            <xp:this.action><![CDATA[#{javascript:viewScope.HideOnLoad=true}]]></xp:this.action>
        </xp:eventHandler>
    </xp:button>
    <xp:div id="MainContent">
        <xp:div>
            <xp:this.rendered><![CDATA[#{javascript:if(!viewScope.HideOnLoad){
return false
}else{
return true
}}]]></xp:this.rendered>
            <xp:div>
                <xp:table>
                    <xp:tr>
                        <xp:td>
                            <xp:label id="label1">

                            <xp:this.value><![CDATA[#{javascript:var startTime = new Date().getTime();
var elapsedTime = 0;
var timeOutSeconds = 20;

while ( elapsedTime < timeOutSeconds) {
  java.lang.Thread.currentThread().sleep(1000);
  //re-check condition here

  elapsedTime = (new Date().getTime() - startTime) / 1024;
}

return "Name1"}]]></xp:this.value></xp:label></xp:td>
                        <xp:td>
                            <xp:inputText id="inputText1"
                                value="#{viewScope.Name}">
                            <xp:this.defaultValue><![CDATA[#{javascript:"test"}]]></xp:this.defaultValue></xp:inputText></xp:td>
                    </xp:tr>
                    <xp:tr>
                        <xp:td>
                            <xp:label value="Company" id="label2"></xp:label></xp:td>
                        <xp:td>
                            <xp:inputText id="inputText2"
                                value="#{viewScope.Company}">
                            </xp:inputText></xp:td>
                    </xp:tr>

                </xp:table></xp:div>
        </xp:div>
    </xp:div>
    <xc:standby></xc:standby>
    <xp:eventHandler event="onClientLoad" submit="false">
        <xp:this.script><![CDATA[//increase timeout value for long running XPage requests 

dojo.onLoad(function(){ XSP.submitLatency = 600 * 1000;var id="#{id:LoadWait}";document.getElementById(id).click()}]]>

要使代码正常工作，您需要将standby widget code 添加到名为“standby”的自定义控件中

Answer 3

这不是最佳实践，但您可以创建一个 XPage (XParent)，其中只包含一个活动备用小部件（或任何加载指示器）和一个 iframe 到您实际想要向用户显示的 XPage (XChild)。 XParent 需要有一个 JavaScript 函数，名为 hideStandby()，它允许隐藏备用小部件。那么您只需将parent.hideStandby() 添加到XChild 的onClientLoad 事件中。使用此设置，当用户访问 XParent 时，备用小部件立即可见，并且 XChild 在 iframe 内的背景中加载。一旦加载完成，XParent 中的备用小部件就会从 XChild 中隐藏。如果您将 iframe 跨越整个页面（css = position:fixed;width:100%;height:100%;border:none;...），用户不会知道实际上涉及 2 个不同的页面。