How to make $.get() function synchronous in jQuery?

Question

I want to make $.get() method synchronous in my function. In ajax aysnc : false helps me, now how do i do the same to to $.get()

var ifsc_code = $('#ifsc-code').val();
var api_url = 'http://api.techm.co.in/api/v1/ifsc/'+ifsc_code;
$.get(api_url, function(data, status){
//console.log(data.status);

var status = data.status;


  if (data.status == "success") {

      $.each(data,function(key,value){
       var address = value.BANK+", " + value.BRANCH+", " + value.ADDRESS ;
        $('.bank-details').removeClass('no-ifsc').text(address);
        });
        var res = "true";
        alert('inside checkIfsc true');
        return res;
        }

        else if (data.status == "failure") {
         $('.bank-details').addClass('no-ifsc').text(data.message);
         var res = "false";
         alert('inside checkIfsc false');
         return res;
        }

Or is there any other approach to do the same ?

Why do you want to do this? It's almost always a very bad idea. If the server is slow to respond, it will lock up the browser. And in some browsers, it will lock up *every* browser window and tab. If the purpose is to make your code easier to write, you should bite the bullet and write proper asynchronous code that avoids these problems. — Michael Geary, May 25 '17 at 05:03

score 12 · Accepted Answer · edited Jan 11 '20 at 16:19

12

$.get also accepts parameter like this

$.get({
  url: url,// mandatory
  data: data,
  success: success,
  dataType: dataType,
  async:false // to make it synchronous
});

edited Jan 11 '20 at 16:19

Anupam

14,950
19
67
94

answered May 25 '17 at 04:56

brk

48,835
10
56
78

Good to know is that this will make your browser/page freeze until request has finished – Joel Harkes Nov 09 '17 at 19:37
1

interesting! didn't know that (FYI: just a caveat that Chrome gives a warning that asynchronous XMLHTTPRequest is deprecated) – Anupam Jan 11 '20 at 16:55
This would have been exactly the behavior I need but on Chrome headless it seems to not retrieve any content. – Tox Jan 18 '21 at 16:26

score 5 · Answer 2 · answered May 25 '17 at 05:13

Although already answered:

$.ajax({
  method: 'GET',
  async: false
});

I want to warn of you the following:

Blocks javascript execution, and might thus lock the webpage (no buttons working etc etc, it looks like your page hangs during the ajax call)
Using synchronous calls gives console warnings.

Javascript is build based on event-driven design. you could also fire an custom named event (with the data result in the event data) when the ajax/get call is complete and let the followup action listen to this event.

eg:

$(form).on('submit',function(){
   var formEl = this;
   $.get({...}).success(function(data){
     var event = new Event('data-submitted');
     event.data = data; 
     formEl.dispatchEvent(event);
   })
});
$(form).on('data-submitted',function(event){
  var data = event.data;
  // you can handle the post ajax request event here.
});

score 2 · Answer 3 · answered May 25 '17 at 05:02

2

add an object parameter

$.get({
url: 'your-url',
async:false
});

answered May 25 '17 at 05:02

PenAndPapers

2,018
9
31
59

How to make $.get() function synchronous in jQuery?

3 Answers3

Linked