I am calling a third party webservice using getJSON callback. The function does not have a success handler attached to the function and since it is third party, I cannot edit the code also. By the time I receive the response, some of the javascript function in the page already executes.
Is there any way I can delay the execution of the Javascript function till I receive the response data from web service except setTimeout method.
Description
You can use jQuery's .ajaxStart() and .ajaxComplete() events to get noticed if your ajax call is running. You can create a bool variable, something like isAjaxRunning and put this around the other javascript. So if isAjaxRunning is true, dont execute other javascript.
More Information
jQuery.ajaxStart()
jQuery.ajaxComplete()
if you have access to the code you can make it synchonize by adding the attribute
async : false
- then it won't be a asynchronous call like the normal ajax .
If you can post the sample code - that will give a clear picture.
Related
I have an object which acts as a client side API Client which exposes several functions which all return jQuery ajax() objects. Some of those ajax calls have .done() and .fail() calls chained directly onto them because they are actions which need to be taken every time the API responses come back before the rest of the js code is allowed to deal with the response. Pretty standard stuff.
I need to kick off a variable number of API requests, wait for all to fail or succeed, and then continue processing. For the examples I will create, I will simplify this down to just two ajax calls.
So I create an array to hold the returned ajax objects, and then use $.when().apply(null, deferreds).then(function(){//do something after both ajax requests complete}). When the calls complete successfully, everything works great. When calls fail (such as if the ajax call 404s), things are not so great.
The problem is that .then() doesn't seem to detect the fails, even though I thought then() was supposed to be fired regardless of success or failure of the underlying promise(s).
I can switch to .always(), which seems to work better (in that it detects the failures and still triggers the callback) but it seems to fire before some of the .fail() callbacks that are registered directly on the ajax calls, which doesn't make sense to me since I thought the callbacks for an ajax call were called in the order they were registered.
I'm sure I'm just missing something about the behavior of the ajax() when() then() combo.
Fiddle showing successful calls using .then(): https://jsfiddle.net/kwrLyw6q/5/
Fiddle using .then() with failed ajax calls (not working, would love to know why. Seems like this is the "right" way to do it, but I can't figure out where I'm going wrong): https://jsfiddle.net/kwrLyw6q/2/
Fiddle using .always() (working, but notice the out-of-order callback order. At least, out of order compared to the order I want them!): https://jsfiddle.net/kwrLyw6q/7/
It looks like deferred.then() takes three arguments:
success function (first argument).
fail function (second argument).
progress function (third)
updated fiddle
I am calling a javascript function multiple times in my javascript code. Inside my javascript there is a jQuery Ajax call. What is happening now is while one function call is going on, another function started hit that function and I got some error. When I try to make that Ajax call synchronous, it works fine to me.
Any one have any idea how to call same function with Ajax asynchronously having Ajax call inside it. same function may be called in same time.
This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
return AJAX callback return
I have made a JQuery code using AJAX, but despite all my efforts (trying $.post, $.get and $.ajax) I am not able to get any response nor using it in my code.
Example code:
var r = $.post("ajaxpage.php", function(data) {return data});
console.log(r); // nothing
One of the most common misconceptions of beginner programmers about Javascript and AJAX is to treat the AJAX request as a "normal" function, doing variable assignments or expecting to use immediately the AJAX response in their code.
That's not how it works though; let's try to understand how a correct implementation works.
AJAX stands for Asynchronous JavaScript and XML.
We will ignore for a while the XML part (which is more about how the request is carried on, via XMLHttpObject), the Javascript bit is quite obvious (it's the scripting language we use, with or without JQuery), let's focus on asynchronous.
Think about AJAX this way: it is roughly like sending a work email to a colleague, while you're at work, and giving some info; and requesting an action to be taken and/or other info in return; no matter if your friend answers immediately or not, you still have to continue your job because the answer could be delayed (your friend may be particularly busy today).
When your friends answers with relevant info, only then you will address the matter and take appropriate actions. If an action is requested, your colleague will carry it on only when he receives your email.
AJAX works in a similar way: from client-side, you make a request to a server-side page, and expect an action (like writing a row in a database) or a response (some data fetched server-side from the page you are calling.
The important bit is that your JavaScript code continues its execution regardless of the completion of the round-trip, as there can be a significant delay when your client (remember that JS runs client-side) makes an AJAX call to the server (slow server, slow connection, and so on).
So you can't expect to do things like:
var r = $.post("ajaxpage.php", function(data) {return data});
because $.post doesn't actually "return" a value like a "regular" function, the variable r cannot be valued by $.post
Instead, you should organize your code based on the done event, which is fired after the AJAX call has completed: it guarantees (if there have been no failures, like server-side errors, not found pages, etc.) that we actually have a response to use in your code on success.
With that event we can call a function that receives the response as a parameter and actually uses it.
$.post("ajaxpage.php").done(useMyResponse);
// rest of the code
function useMyResponse(response)
{
// do fancy things with the response like:
console.log(response); // works!
// or maybe
$("#someElement").html(response);
}
A shorthand for this would be:
$.post("ajaxpage.php",function (response) {
// use response
console.log(response);
});
Edit: i'm not a native English speaker, forgive my mistakes.
i'm not sure this is possible.
I have two ajax calls executed during a button click event.
first ajax call is to add data to database using jquery ajax post .
the second one is to add another set of data to database too via jquery ajax post too
The first one will execute first then the second one. i have set a timer to the second call(windowstimeout) to create a time interval between both execution to test if i can pause the first ajax call.
You will be asking me why i don't want to combine both calls. i have the reasons to do, and i want to know is it really possible to pause an ajax call. I have search around the net , all i found is the ajaxstop(jQuery) but it don't really pause it , it stops the ajax call.
SO anyone have any idea to do so? Thanks.
Why do you want to pause it? You can't, but why would you want to? Just let them both run, or don't trigger the first call till the second is done.
No, you cannot pause Ajax calls - they are just instances of the normal HTTP request/response cycle and behave as such. If the server-side operations resulting from the second call depend on the results of the first one, then why don't you just chain the calls and trigger the second one in the first's success callback handler?
You cannot do that.
You should really ask yourself if the design of your data exchange protocol is correct.
Pausing a request (whatever the communication protocol is, AJAX or any other) should not work since you cannot know if there are other requests and what they do.
So ask yourself the questions: what is my exact need ? what are the other ways to do that ?
I have a few questions on jQuery AJAX.
It is confusing to understand why there are multiple methods like load(), get(), post()..is the diff only like $.ajax is general way of writing and others being specific based on type..?
I do not cleatly understand the diff between complete, success..Are they similar or is there any diff as to when each should be used ?
In terms of script execution from within an HTML response, does jQuery AJAX handle it automatically OR do we need to specify something like eval() ? Also how diff is this behavior compared to a normal AJAX only handling?
Regarding the beforeSend , is it similar to ajaxSetup and generally speaking, what are the common attributes which are used out of the many which are availbale?
Edited
Also is the code written as callback for load()..e.g. load(url,function(){});
same as what is mentioned under success or ajaxSuccess..I mean will the callback function code not exectuted at the same time as the success or ajaxSuccess ?
Thnak you.
1) you need to understand HTTP. get and post make "GET" and "POST" requests, respectively, which is useful if you are building a RESTful service. EDIT: I actually don't see get and post methods on the ajax object; you pass a 'type' parameter to specify the HTTP method you want to use.
2) success fires on success, i.e. if the response returns a 200. complete always fires after everything else is done.
3) Ideally, your server would return json. If you configure the Ajax call to expect json, then it will parse it for you.
4) The documentation is very clear, beforeSend is fired before the actual underlying ajax request is invoked. The documentation says things like "Use this to set custom headers, etc."
They are just "shorthand"
everything can be done and function
the exact same with $.ajax(), the
difference is only syntax
complete is fired after every request is complete, while success only fires if there were no errors (a successfully one
whatever you want to do with the HTTP response you do by making a function(data){dostuff(data);} in the success callback area
beforeSend is called right before the ajax request is fired
Documentation