execute standby dialog from link

▼魔方 西西 提交于 2020-01-02 16:24:24

问题


Here is what i have : Xpages page that fills in form based on url parameter by key. This can take upto 10 sec to render and i would like to let the user know that the form is doing something.

Fredrik Norling did a great standby dialog and its works great when i use it on button(save) http://openntf.org/XSnippets.nsf/snippet.xsp?id=standby-dialog-custom-control (am using Partial update on ID on the form when saved)

How can i execute this script block from a link in a email ? There are option like beforepageload , afturpageload or should i use beforeRenderResponse and if so how to i do that.


回答1:


I would load the XPage empty and have a hidden button that would be clicked in the onload event of the page. This button will execute some serverside SSJS that will show the controls the you want to show. Then the Standby widget will take care of the rest. And the user will get the wait dialog.

 <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()}]]>

To make the code work you need to have the standby widget code added in to a custom control called "standby"




回答2:


After doing some experimenting, it looks like you are going to have a hard time accomplishing what you want to do. The events you referenced above are all server side events, so there is no way to communicate with users client side. view.postScript will not work for that either.

The problem is (I'm assuming) all of your logic is being done before the page loads. Therefore, I think the only way to accomplish this is to delay the processing of your logic until AFTER the page has loaded by doing a partial refresh.

You can do this by moving all of your logic to a custom control, adding that custom control to a panel, and then in the onClientLoad event of the XPage, do a partial refresh of the panel, which will trigger the standby functionality automatically.

I mocked up an example of what I am talking about:

Xpage code

<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>

The key parts of the code above are a viewScope variable being set to "false" on page load and then prior to the partial refresh it is set to "true". Setting it to true unhides the logic custom control and allows it to process as normal.

logic custom control

<?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>

I have a suspicion there might be a better way to do this but this method works pretty well.




回答3:


This is not best practice, but you could create a XPage (XParent) that contains just an active standby widget (or any loading indicator) and an iframe to the XPage (XChild) you actually want to show to the user. XParent needs to have a JavaScript function called something like hideStandby() that allows to hide the standby widget. Then you only have to add parent.hideStandby() to the onClientLoad event of XChild. With this setup, when the user visits XParent, the standby widget is immediately visible and XChild is loaded in the background inside the iframe. As soon as the loading is complete, the standby widget in XParent is hidden from within XChild. If you span the iframe over the whole page (css = position:fixed;width:100%;height:100%;border:none;...) the user won't know that there are actually 2 different pages involved.



来源:https://stackoverflow.com/questions/25103409/execute-standby-dialog-from-link

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!