Software Archive
Read-only legacy content
17061 Discussions

Popup loading gif

Mario_R_
Beginner
386 Views

Hello to all,

I need advice to display a popup with a loading gif, during calls synchronous XMLHttpRequest ().
As an example I would like to see something very similar to what happens in the App Preview of Intel during uploads.

I did some tests, but I can not see the sequences in the right order. They are loaded all together once the request XMLHttpRequest ().
Tell me if you need a code example on which to apply the popup loading gif.

Thank you all

0 Kudos
3 Replies
Rakshith_K_Intel
Employee
386 Views

Post your code snippet, that will help.

Here is example xhr request and where you can show/hide loading popup, code will look something like this:

    

showLoadingGif();
var url = "http://...";
var req = new XMLHttpRequest();
req.onreadystatechange = function() {
    if(req.readyState == 4){
        if(req.status == 200){
           hideLoadingGif();
	   // handle response	
        } else {
	   hideLoadingGif();
	   // handle response
        }
    }
};
req.open('GET', url, true);
req.send();

 

0 Kudos
Mario_R_
Beginner
386 Views

Hi Rakshith, thanks for your answer.

Here's my example, the problem is when the request is synchronous (req.open ('GET', url, false)), in which case it happens: the app freezes and then the page is opened directly with the result. Without load the gif.
If the asynchronous imposed as in your example, everything works fine.

 

 $(document).on("click", "#btn_test", function(evt)
    {
		activate_page("#page_test");
		showLoadingGif();
			
		var req = new XMLHttpRequest();
		req.onreadystatechange = function() {

			if(req.status == 200){
				hideLoadingGif();
				showResult();
			}
		}
		req.open('GET', "http://..", false);
		req.send();

    }); 

 

0 Kudos
Rakshith_K_Intel
Employee
386 Views

can you post the full code, what is the url?

0 Kudos
Reply