等待图标/消息在xpages中

时间:2016-11-22 07:40:19

标签: xpages ssjs

我希望在代码运行时使用一些等待的对话框/图标/图像。代码完成后,想要停止该图标。我已经浏览了网上提供的资料,但未能理解。

我正在使用SSJS脚本,该脚本在后端调用代理。处理过程需要20-30秒。

我已经通过,但不知道利用率?

https://openntf.org/XSnippets.nsf/snippet.xsp?id=bootstrap-standby-dialog

http://xpagesera.blogspot.com/2012/05/add-ajax-loading-control-in-xpages-for.html

http://lotusnotus.com/lotusnotus_en.nsf/dx/xpages-tip-a-modal-waiting-dialog-for-background-processes..htm

我尝试了以下内容它适用于IBM Notes 9.0.1的浏览器,但不适用于XPiNC。我在使用One UI V 2.1时,它在XPiNC或Web客户端中不起作用。

   <xp:this.resources>
        <xp:dojoModule name="extlib.dijit.ExtLib"></xp:dojoModule>
        <xp:dojoModule name="extlib.dijit.Loading"></xp:dojoModule>
   </xp:this.resources>

在事件处理程序中,我使用部分刷新在页面上使用了以下事件。

   <xp:this.onStart><![CDATA[XSP.startAjaxLoading()]]></xp:this.onStart>
   <xp:this.onComplete><![CDATA[XSP.endAjaxLoading()]]></xp:this.onComplete>
   <xp:this.onError><![CDATA[XSP.endAjaxLoading()]]></xp:this.onError>

如何在客户端和One UI 2.1上使用此代码来实现此功能。

我非常感谢您在我最初提出的问题时收到的回复,并且期望也是如此。

最诚挚的问候, Qaiser Abbas

2 个答案:

答案 0 :(得分:1)

使用第一个选项(这可能需要bootstrap,因此OpenNTF版本的扩展库),这是一个自包含的自定义控件,可自动劫持任何部分刷新并添加加载掩码。如果您按照以前版本的链接进行操作,则会提供实施说明:

&#34;将其添加到自定义控件并将其添加到xpages以在每次部分刷新时获得待机对话框&#34;

后两个链接是更多手动选项。 onStartonErroronComplete是EventHandler的属性。您无法从包含EventHandler的组件(例如Button,Edit Box等)访问它们。您需要转到源窗格,单击EventHandler本身,然后将显示 EventHandler 的所有属性框,而不是包含EventHandler的组件

答案 1 :(得分:0)

以下是第二个链接Add AJAX “Loading..” control in XPages for Partial Updates的示例XPage:

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core" style="margin:200px">
    <xp:this.resources>
        <xp:dojoModule name="extlib.dijit.Loading" />
    </xp:this.resources>
    <xp:button id="button1" value="Show time in 3 seconds">
        <xp:eventHandler
            event="onclick"
            submit="true"
            refreshMode="partial"
            refreshId="panel1">
            <xp:this.action><![CDATA[#{javascript:
                viewScope.clickTime = new Date();
                var waitUntil = viewScope.clickTime.getTime() + 3000; 
                while(waitUntil > new Date().getTime()) {
                    // wait 3 seconds
                }
            }]]></xp:this.action>
            <xp:this.onStart><![CDATA[XSP.startAjaxLoading()]]></xp:this.onStart>
            <xp:this.onComplete><![CDATA[XSP.endAjaxLoading()]]></xp:this.onComplete>
            <xp:this.onError><![CDATA[XSP.endAjaxLoading()]]></xp:this.onError>
        </xp:eventHandler>
    </xp:button>
    <xp:panel id="panel1">
        <xp:text
            escape="true"
            id="computedField1"
            value="#{viewScope.clickTime}"
            style="font-size:48pt">
            <xp:this.converter>
                <xp:convertDateTime type="both" />
            </xp:this.converter>
        </xp:text>
    </xp:panel>
</xp:view>

当您点击按钮时,它会显示“请稍候......”三秒钟,然后点击按钮的时间。

确保在按钮的eventHandler和有效的refreshId中设置refreshMode="partial"