Develop Reference

Success data returns null from AJAX GET type [duplicate]

This question already has answers here:
Why is my variable unaltered after I modify it inside of a function? - Asynchronous code reference
(7 answers)
How do I return the response from an asynchronous call?
(41 answers)
Closed 3 years ago.
I am using the following codes to get success data into a variable:
var compdet = null;
$.ajax({
url: uri2 + "/" + $("#textbox_id").val(),
type: "GET",
cache: false,
success: function (data) {
compdet = data;
}
});
And to check if my var compdet has value in it, I added:
console.log(compdet);
Sadly, it returns JUST null. So I tried putting the console.log into
success: function (data) { console.log(data); }
And it returns the output that I want to see. Anyone who can explain this to me?
I realized something here. You can actually make Javascript function async and await AJAX calls.
For example:
async function func_name() {
await $.ajax({
// some codes here
});
}

JavaScript execution is synchronous but AJAX is asynchronous. If you have any code after AJAX it might execute before completing the AJAX. That's why you are getting the value null.
In this scenario you can execute your next code stuff inside success() callback or call another method to execute the next code chunk.
An example with method call:
function next(compdet) {
// code stuff
}
$.ajax({
url: uri2 + "/" + $("#textbox_id").val(),
type: "GET",
cache: false,
success: function (data) {
next(data)
}
});
See the difference between synchronous vs asynchronous.

global variable when using ajax() [duplicate]

This question already has answers here:
How do I return the response from an asynchronous call?
(41 answers)
Closed 7 years ago.
$.ajax({
type: "POST",
url:"example.com",
success: function (data) {
myData = data;
},
error: function (response) {
}
//here json = myData;
});
I have to do json = myData which is outside the callback function of ajax() to make it as a global variable, I wonder is this a good practice? How else can I use the data of my ajax callback?

Why do you want to break the asynchronous nature that Ajax was literally designed to have? "Problems" like these have been repeatedly asked on StackOverflow. But the one key thing they forget is that Ajax was designed to be asynchronous, and by trying to use the data outside of the function you're somewhat breaking that rule.
TL;DR: Ajax was designed to be asynchronous, lets keep it that way.
If you want to keep a neat structure, define a handler.
function handler(data) {
// Handle data
console.log(data)
}
$.ajax({
url: "http://localhost",
type: "POST",
data: {'example':true},
success:handler
});
I do not advise this method, read the above on why not.
If you truly need to perform a synchronous Ajax request (sjax? Lol, jQuery does provide a feature to "turn off the asynchronous nature", using the async: false in the object appears to solve that. Here is an example:
var outterData;
$.ajax({
async: false,
url: "/echo/json/",
data: {testing:true},
success: function(data){
outterData = data;
}
});
console.log(outterData);
As you can see, async: false was included in this. And it appears to work fine, based on this JSFiddle a built.
But remember, I don't advise you take away the asynchronous nature of Ajax (it's in the name, for crying out loud). But if you must.

Is there a default timeout for jQuery`s getScript method? [duplicate]

This question already has answers here:
JQuery ajax call default timeout value
(5 answers)
Closed 7 years ago.
I am using jQuery's getScript() method to load some third part js library, I am wondering whether there's a default time out value for this method. I don't really believe getScript will keep waiting until it gets a response, but I need to know how long before it quit and if that value is not ideal to me, is there a way to configure it? Maybe something like this?
$.ajaxSetup({
cache: true
});

According to jQuery documentation
This is a shorthand Ajax function, which is equivalent to:
$.ajax({
url: url,
dataType: "script",
success: success
});
So it uses the default timeout which you can override as usually you do for jQuery.ajax.

How to make a function return data retrieved via AJAX [duplicate]

This question already has answers here:
How do I return the response from an asynchronous call?
(41 answers)
Closed 9 years ago.
In my javascript file, I use the function above to get asynchronously a value calculated by the server:
function function2(userid)
{
$.ajax({
type: "POST",
url: "http://localhost/bghitn/web/app_dev.php/get_number_of_articles",
data:{id:userid},
cache: false,
success: function(data){
return data;
}
});
}
In fact, I call the function2 inside a set of functions:
function1();
var userid=.....
var x= function2(userid);
function3(x);
The problem:
as you see, function3 uses the data returned by function2. But it seems that function3 starts executing before the AJAX call is successfully finished. I tried to use the when function but in vain.
$.when(function2(userid)).done(function(){
function3();
});
How to make the next javascript code executes after the preceding AJAX request is successfully performed? Your advices are highly appreciates.

Option 1: You can always set your AJAX call to be synchronius, but be ready that the whole page stucks while waiting for response. just add parameter async: false to your set of parameters.
Option 2: Provide callbacks or put your future code inside success handler
Option 3: You can use defer/promise described here http://blog.mediumequalsmessage.com/promise-deferred-objects-in-javascript-pt1-theory-and-semantics

how to make a jquery "$.post" request synchronous [duplicate]

This question already has answers here:
How can I get jQuery to perform a synchronous, rather than asynchronous, Ajax request?
(14 answers)
Closed 9 years ago.
I’ve been googling this and avoiding this error in my bug fix list for a long time now, but I’ve finally reached the end of the list, the last of which I have to make a function return true/false to state whether the validation has succeeded or not.
I'm using ajax to compare certain fields with those that are already in the db and by default the $.post() method does it's operations asynchronously.
I’m setting a variable inside the call onSuccess and the calling method doesn't get a response because of this, so all my js/jquery fails on pageLoad... I would prefer if I could still keep using the $.post method.

jQuery < 1.8
May I suggest that you use $.ajax() instead of $.post() as it's much more customizable.
If you are calling $.post(), e.g., like this:
$.post( url, data, success, dataType );
You could turn it into its $.ajax() equivalent:
$.ajax({
type: 'POST',
url: url,
data: data,
success: success,
dataType: dataType,
async:false
});
Please note the async:false at the end of the $.ajax() parameter object.
Here you have a full detail of the $.ajax() parameters: jQuery.ajax() – jQuery API Documentation.
jQuery >=1.8 "async:false" deprecation notice
jQuery >=1.8 won't block the UI during the http request, so we have to use a workaround to stop user interaction as long as the request is processed. For example:
use a plugin e.g. BlockUI;
manually add an overlay before calling $.ajax(), and then remove it when the AJAX .done() callback is called.
Please have a look at this answer for an example.

If you want an synchronous request set the async property to false for the request. Check out the jQuery AJAX Doc

From the Jquery docs: you specify the async option to be false to get a synchronous Ajax request. Then your callback can set some data before your mother function proceeds.
Here's what your code would look like if changed as suggested:
beforecreate: function(node,targetNode,type,to) {
jQuery.ajax({
url: url,
success: function(result) {
if(result.isOk == false)
alert(result.message);
},
async: false
});
}
this is because $.ajax is the only request type that you can set the asynchronousity for