javascript - Why is this function not waiting until it has data from XHR request? -


when call getcurrentconditions tries return data before requestdata has completed , therefore doesn't find data.currently. definately getting data returned url, have tried adding timeout loop wait xhr load, broke script together. kind of confused why second function not waiting this.requestdata(latitude, longitude); finish before continuing.

this.requestdata = function(latitude, longitude) {     request_url = self.api_endpoint + api_key + '/' + latitude + ',' + longitude + '?units=auto';     var xhr = new xmlhttprequest();     xhr.onreadystatechange = function() {         if(xhr.readystate==4 && xhr.status==200) {             content = xhr.responsetext;             if(content != '' && (content)) {                 return json.parse(content);             } else {                 return false;             }         }     }     xhr.open('get', 'proxy.php?url='+request_url, true);     xhr.send(null); } /**  * return current conditions  *  * @param float $latitude  * @param float $longitude  * @return \forecastioconditions|boolean  */ this.getcurrentconditions = function(latitude, longitude) {     data = this.requestdata(latitude, longitude);     if(data !== false) {         return new forecastioconditions(data.currently);     } else {         return false;     } }    var forecast = new forecastio(api_key); var condition = forecast.getcurrentconditions(latitude, longitude); 

because ajax asynchronous, means once request sent continue executing without waiting response.

one easy solution turn off asynchronous nature passing 3rd parameter .open() method false, has drawbacks browser thread blocked till request completed means ui remain unresponsive till request completed.

xhr.open('get', 'proxy.php?url='+request_url, false); 

the correct solution use callback method

this.requestdata = function(latitude, longitude, callback) {     request_url = self.api_endpoint + api_key + '/' + latitude + ',' + longitude + '?units=auto';     var xhr = new xmlhttprequest();     xhr.onreadystatechange = function() {         if(xhr.readystate==4 && xhr.status==200) {             content = xhr.responsetext;             if(content != '' && (content)) {                 callback(json.parse(content));             } else {                 callback(false);             }         }     }     xhr.open('get', 'proxy.php?url='+request_url, true);     xhr.send(null); } /**  * return current conditions  *  * @param float $latitude  * @param float $longitude  * @return \forecastioconditions|boolean  */ this.getcurrentconditions = function(latitude, longitude, callback) {     this.requestdata(latitude, longitude, function(data) {         if(data !== false) {             callback(forecastioconditions(data.currently));         } else {             callback(false);         }     }); }    var forecast = new forecastio(api_key); forecast.getcurrentconditions(latitude, longitude, function(condition){     if(condition !== false) {      } else {      } }); 

Comments

Popular posts from this blog

Why does Ruby on Rails generate add a blank line to the end of a file? -

keyboard - Smiles and long press feature in Android -

node.js - Bad Request - node js ajax post -