roosevelt Posted February 2, 2011 Share Posted February 2, 2011 Hi, I am trying to build a loading screen system using jQuery. What I want my code to do is as soon as there's an ajax request made to the server, pop-up a loading screen and as soon as the request is complete whether it was a success or failure the loading screen would go away. I already have a generic function that I use to make all sorts of AJAX requests but I wanted to know if there's a way to bind those effects without updating that function. Thanks! Link to comment Share on other sites More sharing options...
0 Tekkerson Posted February 2, 2011 Share Posted February 2, 2011 I use jQuery a lot including AJAX but not enough to have the need to do something like that yet. If you're looking for more resources I recommend you visit http://www.stackoverflow.com and if you decide to join, http://chat.stackoverflow.com/rooms/17/javascript has a lot of helpful people that can help you with this. I'm talking to them as I speak :p Link to comment Share on other sites More sharing options...
0 sweetsam Posted February 2, 2011 Share Posted February 2, 2011 The functions you are looking for is .ajaxStart and .ajaxStop Link to comment Share on other sites More sharing options...
0 i11usive Posted February 2, 2011 Share Posted February 2, 2011 Here's a routine I use quite a lot: $.ajax({ type: "POST", url: "handlerURL", data: "{'one':'one'}", contentType: "application/json; charset=utf-8", dataType: "json", timeout: 5000, cache: false, success: function (response) { do your success stuff here }, error: function (objAJAXRequest, strError) { do your failure stuff here } }); Link to comment Share on other sites More sharing options...
0 AdamLC Posted February 6, 2011 Share Posted February 6, 2011 The functions you are looking for is .ajaxStart and .ajaxStop This is the way you want to go. Something like this is what I use. It is triggered by every ajax request and then closed then it has finished //Turn on loading div $("#loadingDiv").bind("ajaxSend", function () { $(this).fadeIn('fast'); }).bind("ajaxComplete", function () { $(this).fadeOut('fast'); }); Link to comment Share on other sites More sharing options...
Question
roosevelt
Hi,
I am trying to build a loading screen system using jQuery.
What I want my code to do is as soon as there's an ajax request made to the server,
pop-up a loading screen and as soon as the request is complete whether it was a success or failure
the loading screen would go away.
I already have a generic function that I use to make all sorts of AJAX requests but I wanted to know
if there's a way to bind those effects without updating that function.
Thanks!
Link to comment
Share on other sites
4 answers to this question
Recommended Posts