Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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

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 ?

like image 388
Naveen Kumar Avatar asked May 25 '17 04:05

Naveen Kumar


People also ask

How do I make synchronous fetch?

If XMLHttpRequest is also fine, then you can use async: false, which will do a synchronous call. Show activity on this post. If you don't want to use the fetch api you will have to use callbacks, event listeners, XMLHttpRequest. As it's currently written, your answer is unclear.

What does the get () jQuery function do?

jQuery get() Method get() method loads data from the server using a HTTP GET request.

Is jQuery synchronous or asynchronous?

By default jQuery is not providing synchronous request, so we have to implicitly define synchronous request using $. ajax().

How do you make AJAX request synchronous?

ajax({ type: "POST", async: "false", url: "checkpass. php", data: "password="+password, success: function(html) { var arr=$. parseJSON(html); if(arr == "Successful") { return true; } else { return false; } } }); $. ajaxSetup({async: true});


2 Answers

$.get also accepts parameter like this

$.get({
  url: url,// mandatory
  data: data,
  success: success,
  dataType: dataType,
  async:false // to make it synchronous
});
like image 165
brk Avatar answered Sep 27 '22 21:09

brk


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.
});
like image 34
Joel Harkes Avatar answered Sep 27 '22 19:09

Joel Harkes