display loading div when doing a submit or a redirect

classic Classic list List threaded Threaded
2 messages Options
Reply | Threaded
Open this post in threaded view
|

display loading div when doing a submit or a redirect

Adrian Baker-2
I really like the new loading div that gets displayed when a form is
having a lengthly asynchronous interaction with the xforms server.
However I've been a bit frustrated that it doesn't remain displayed when
the interaction results in a <xforms:load show="replace"> to a new url,
particularly if the new location isn't very quick to load. It looks like
the interaction is finished, then there's a pause, then *boom* the page
changes to the new location.

Here's a simple patch to xforms.js that will ensure the loading div is
turned on (or left on) before the form does a POST or a window.location
change (xforms:load show="replace"). Have attached the patched version
also.

I also notice that xformsStoreInClientState is being called even when
window.location.href has been changed - isn't this unnecessary, and can
it be skipped in the same way it is when a POST has been done?

function xformsHandleResponse() {
    if (document.xformsXMLHttpRequest.readyState == 4) {
        var responseXML = document.xformsXMLHttpRequest.responseXML;
        if (responseXML && responseXML.documentElement
                &&
responseXML.documentElement.tagName.indexOf("event-response") != -1) {

            // Good: we received an XML document from the server
            var responseRoot = responseXML.documentElement;
            var newDynamicState = null;
            var newDynamicStateTriggersPost = false;
           
 >           // Whether this response has triggered a load which will
replace the current page.
 >           var newDynamicStateTriggersReplace = false;
           
    ...
           
    // Load another page
    case "load": {
        var loadElement = actionElement.childNodes[actionIndex];
        var resource = loadElement.getAttribute("resource");
        var show = loadElement.getAttribute("show");
        var target = loadElement.getAttribute("target");
        if (show == "replace") {
            if (target == null) {
 >               newDynamicStateTriggersReplace = true;
                window.location.href = resource;
            } else {
                window.open(resource, target);
            }
        } else {
            window.open(resource, "_blank");
        }
        break;
    }      
   
    ...
   
    // Store new dynamic state if that state did not trigger a post
    // TODO isn't this unnecessary if newDynamicStateTriggersReplace  ==
true?
    if (!newDynamicStateTriggersPost) {
        xformsStoreInClientState("ajax-dynamic-state", newDynamicState);
    }          
   
 >   // If we're we're replacing the current page leave the loading
message on.
 >   // Otherwise hide loading if there are no other request in the queue,
 >   if(newDynamicStateTriggersReplace || newDynamicStateTriggersPost) {
 >       xformsDisplayIndicator("loading");
 >   } else if (document.xformsEvents.length == 0) {
 >       xformsDisplayIndicator("none");
 >   }      

    ...

}  

Adrian
           


xforms.js (58K) Download Attachment
Reply | Threaded
Open this post in threaded view
|

Re: display loading div when doing a submit or a redirect

Alessandro  Vernet
Administrator
Adrian,

Good idea. I have integrated and checked in your modifications.

Alex

On 5/3/06, Adrian Baker <[hidden email]> wrote:

> I really like the new loading div that gets displayed when a form is
> having a lengthly asynchronous interaction with the xforms server.
> However I've been a bit frustrated that it doesn't remain displayed when
> the interaction results in a <xforms:load show="replace"> to a new url,
> particularly if the new location isn't very quick to load. It looks like
> the interaction is finished, then there's a pause, then *boom* the page
> changes to the new location.
>
> Here's a simple patch to xforms.js that will ensure the loading div is
> turned on (or left on) before the form does a POST or a window.location
> change (xforms:load show="replace"). Have attached the patched version
> also.
>
> I also notice that xformsStoreInClientState is being called even when
> window.location.href has been changed - isn't this unnecessary, and can
> it be skipped in the same way it is when a POST has been done?
>
> function xformsHandleResponse() {
>     if (document.xformsXMLHttpRequest.readyState == 4) {
>         var responseXML = document.xformsXMLHttpRequest.responseXML;
>         if (responseXML && responseXML.documentElement
>                 &&
> responseXML.documentElement.tagName.indexOf("event-response") != -1) {
>
>             // Good: we received an XML document from the server
>             var responseRoot = responseXML.documentElement;
>             var newDynamicState = null;
>             var newDynamicStateTriggersPost = false;
>
>  >           // Whether this response has triggered a load which will
> replace the current page.
>  >           var newDynamicStateTriggersReplace = false;
>
>     ...
>
>     // Load another page
>     case "load": {
>         var loadElement = actionElement.childNodes[actionIndex];
>         var resource = loadElement.getAttribute("resource");
>         var show = loadElement.getAttribute("show");
>         var target = loadElement.getAttribute("target");
>         if (show == "replace") {
>             if (target == null) {
>  >               newDynamicStateTriggersReplace = true;
>                 window.location.href = resource;
>             } else {
>                 window.open(resource, target);
>             }
>         } else {
>             window.open(resource, "_blank");
>         }
>         break;
>     }
>
>     ...
>
>     // Store new dynamic state if that state did not trigger a post
>     // TODO isn't this unnecessary if newDynamicStateTriggersReplace  ==
> true?
>     if (!newDynamicStateTriggersPost) {
>         xformsStoreInClientState("ajax-dynamic-state", newDynamicState);
>     }
>
>  >   // If we're we're replacing the current page leave the loading
> message on.
>  >   // Otherwise hide loading if there are no other request in the queue,
>  >   if(newDynamicStateTriggersReplace || newDynamicStateTriggersPost) {
>  >       xformsDisplayIndicator("loading");
>  >   } else if (document.xformsEvents.length == 0) {
>  >       xformsDisplayIndicator("none");
>  >   }
>
>     ...
>
> }
>
> Adrian
>
>
>
>
>
> --
> You receive this message as a subscriber of the [hidden email] mailing list.
> To unsubscribe: mailto:[hidden email]
> For general help: mailto:[hidden email]?subject=help
> ObjectWeb mailing lists service home page: http://www.objectweb.org/wws
>
>
>
>

--
Blog (XML, Web apps, Open Source):
http://www.orbeon.com/blog/



--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: mailto:[hidden email]
For general help: mailto:[hidden email]?subject=help
ObjectWeb mailing lists service home page: http://www.objectweb.org/wws
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet