javascript - How do I utilize $.Deferred() to handle a callback function and ajax call -


i beginning wrap head around using promises , use guidance on how scenario work. code below larger plugin file have included pieces think relevant.

there callback function(callbackbeforesend) performing async geolocation stuff(i've got working) , need hold ajax call until functions have completed.

i see in code using $.deferred() handle ajax response , wondering if there way tie callback function , initial ajax call $.deferred() handle proper execution order of everything.

so happen is

  1. callback function fires
  2. async stuff happens in callback , returns lat, lng, address
  3. ajax fires lat, lng, address returned callback

any appreciated. still don't understand promises trying learn. thanks!

$.extend(plugin.prototype, {     _getdata: function (lat, lng, address) {         var _this = this;         var d = $.deferred();          if (this.settings.callbackbeforesend) {             this.settings.callbackbeforesend.call(this, lat, lng, address);         }          $.ajax({             type         : 'get',             url          : this.settings.datalocation + (this.settings.datatype === 'jsonp' ? (this.settings.datalocation.match(/\?/) ? '&' : '?') + 'callback=?' : ''),             // passing lat, lng, , address ajax request can optionally used back-end languages             data: {                 'origlat' : lat,                 'origlng' : lng,                 'origaddress': address             },             datatype     : datatyperead,             jsonpcallback: (this.settings.datatype === 'jsonp' ? this.settings.callbackjsonp : null)         }).done(function (p) {             d.resolve(p);              // loading remove             if(_this.settings.loading === true){                 $('.' + _this.settings.formcontainer + ' .' + _this.settings.loadingcontainer).remove();             }         }).fail(d.reject);         return d.promise();     } }); 

i really don't jquery promises if must...

function callbackbeforesend(){    var def = $.deferred();    //async operation here:    async(function(lat, lng, address) {        //pass resolve object information        //the async callback function might not use 3 parameters,         //object containing        def.resolve({ lat : lat, lng : lng, address : address});        //async function callback     });    return def.promise(); } 

then can use deferred.then() resolved data.

var prom = callbackbeforesend(); prom.then(function(obj){     //lat, lng, address within obj     //use on ajax call below.     $.ajax(); }); 

you can use then chain methods i'd check out jquery version using. behaviour before jquery 1.8 might different.

here's using es6 promises:

function callbackbeforesend(){     return new promise(function(resolve) {          async(function(lat, lng, address){              resolve({lat : lat, lng : lng, address : address});          });     }); } 

then it's same thing:

var prom = callbackbeforesend(); //firstrequest prom.then(function(obj){     //callback finished     //obj holds lat, lng, address     //do ajax request:     $.ajax(); }); 

Comments

Popular posts from this blog

html - Firefox flex bug applied to buttons? -

html - Missing border-right in select on Firefox -

c# - two queries in same method -