I have a javascript widget witch provides standard extension points. One of them is the beforecreate function. It should return false to prevent an item from being created.
I've added an AJAX call into this function using jQuery:
beforecreate: function(node,targetNode,type,to) {
jQuery.get('http://example.com/catalog/create/' + targetNode.id + '?name=' + encode(to.inp[0].value),
function(result) {
if(result.isOk == false)
alert(result.message);
});
}
But I want to prevent my widget from creating the item, so I should return false in the mother-function, not in the callback. Is there any way to perform a synchronized AJAX request using jQuery or any other API? Thanks.
Source: Tips4all
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.
ReplyDeleteHere's what your code would look like if changed as suggested:
beforecreate: function(node,targetNode,type,to) {
jQuery.ajax({
url: 'http://example.com/catalog/create/'
+ targetNode.id
+ '?name='
+ encode(to.inp[0].value),
success: function(result) {
if(result.isOk == false)
alert(result.message);
},
async: false
});
}
You can put the JQuery's AJAX setup in synchronous mode by calling
ReplyDeletejQuery.ajaxSetup({async:false});
and then perform your ajax calls using jQuery.get( ... );
then just turning it on again once
jQuery.ajaxSetup({async:true});
I guess it works out the same thing as suggested by @Adam but might be helpful to someone that does want to reconfigure their jQuery.get() or jQuery.post() to the more elaborate jQuery.ajax() syntax
Excellent solution! I noticed when I tried to implement it that if I returned a value in the success clause, it came back as undefined. I had to store it in a variable and return that variable. This is the method I came up with:
ReplyDeletefunction getWhatever()
{
var strUrl = ""; //whatever URL you need to call
var strReturn = "";
jQuery.ajax({
url:strUrl, success:function(html){strReturn = html;}, async:false
});
return strReturn;
}
Good Post I was trying to do this and I wasn't setting the async to false.
ReplyDeleteI'm using BlockUI which "grays" out the screen and displays a loading message while the server is doing the work.
All of these answers miss the point that doing an AJAX call with async:false will cause the browser to hang until the AJAX request completes. Using a flow control library will solve this problem without hanging up the browser. Here is an example with Frame.js:
ReplyDeletebeforecreate: function(node,targetNode,type,to) {
Frame(function(next)){
jQuery.get('http://example.com/catalog/create/', next);
});
Frame(function(next, response)){
alert(response);
next();
});
Frame.init();
}
function getURL(url){
ReplyDeletereturn $.ajax({
type: "GET",
url: url,
cache: false,
async: false
}).responseText;
}
//example use
var msg=getURL("message.php");
alert(msg);
Make the get request without a callback funtion and it will be "synchronous". For e.g.
ReplyDeletevar result = jQuery.get('http://example.com/catalog/create/');
var responseText = result.responseText;