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
- callback function fires
- async stuff happens in callback , returns lat, lng, address
- 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
Post a Comment