Reputation: 1179
I have a problem when running ajax requests, in Safari and Chrome, not in firefox
var doStuff = function(){
callLoadingScreen();
jsRoutes.controllers.SomeController.someServerSideMethod().ajax({
//ajax stuff
});
closeLoadingScreen();
}
In safari and chrome, when doStuff() is called callLoadingScreen() method is skipped, but the ajax request is sent and only after the ajax request is completed than the method callLoadingScreen() is loaded.
In firefox everything works as its supposed to, but not in chrome and safari. Is this some play issue, or is it a jquery problem. I have tried a lot of fix, but none seem to work.Is there something I am missing, I have done this kind of loading before but don't remember having this issue.
Any help or feedback is welcome. Thank you.
Upvotes: 0
Views: 667
Reputation: 93611
Assuming your code is not running an ajax call with async: false
which you should never do, it should not work as-is on any browser.
You need to wait for the Ajax call to complete before calling closeLoadingScreen
:
e.g.
var doStuff = function(){
callLoadingScreen();
jsRoutes.controllers.SomeController.someServerSideMethod().ajax({
//ajax stuff
complete: function(){
closeLoadingScreen();
}
});
}
In your example, it is doing this:
callLoadingScreen();
closeLoadingScreen();
// Get response from Async Ajax call here sometime much later!
If you want to use promises instead, try it this way:
var doStuff = function(){
callLoadingScreen();
jsRoutes.controllers.SomeController.someServerSideMethod().ajax({
//ajax stuff
}).then(closeLoadingScreen);
}
Upvotes: 2