How to pass a variable inside a function inside a jquery function?

Question

So I'm working with a google map api. I have to insert the values lat and lon inside of the object, but I can't do something like:

$.get(url).done(buscaGPS(data, i));

function buscaGPS(data, i) {

}

CODE

objecto = [{
    "address_1": "Avenida da Republica, 15A",
    "city": "Lisbon",
    "country": "pt",
    "id": 1534282,
    "name": "Pastelaria Versailles"
}, {
    "address_1": "Avenida da Republica, 15A",
    "city": "Lisbon",
    "country": "pt",
    "id": 1534282,
    "name": "Pastelaria Versailles"
}];


for (var i = 0; i < objecto.length; i++) {
    var url = "http://maps.googleapis.com/maps/api/geocode/json?address=" + objecto[i].address_1 + "+" + objecto[i].city + "+" + objecto[i].country + "&sensor=false";
    $.get(url).done(buscaGPS);
};



function buscaGPS(data) {

    objecto[i].lat = data.results[0].geometry.location.lat;
    objecto[i].lon = data.results[0].geometry.location.lng;

}

Can you please clarify what you have problem with? There seem to be 2 functions with the same name in your code - not sure if it is intentional or just copy paste error. — Alexei Levenkov
– Alexei Levenkov, Commented May 22, 2013 at 17:09
You have buscaGPS function declared twice. I would try removing the first declaration and running the code again to see if they are conflicting. — bottens
– bottens, Commented May 22, 2013 at 17:10
ah i get it. You need to match the index to the response so you can put the response data in the right place? — Shanimal
– Shanimal, Commented May 22, 2013 at 17:18
No, that twice should be the parte where I had the doubt. I have to edit to separate from the code. Yes Shanimal. — hensansi
– hensansi, Commented May 22, 2013 at 17:28

Shanimal · Accepted Answer · 2013-05-22 17:16:41Z

1

It sounds like you mean you want to do something like...

// create a closure to capture the index
function callback(index){
    return function(data) {
        objecto[index].lat = data.results[0].geometry.location.lat;
        objecto[index].lon = data.results[0].geometry.location.lng;
    }
}

for (var i = 0; i < objecto.length; i++) {
    var url = "http://maps.googleapis.com/maps/api/geocode/json?address=" + objecto[i].address_1 + "+" + objecto[i].city + "+" + objecto[i].country + "&sensor=false";
    $.get(url).done(callback(i));
}

edited May 22, 2013 at 17:16

answered May 22, 2013 at 17:09

Shanimal

11.8k7 gold badges67 silver badges82 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

hensansi Over a year ago

$.get(url).done(buscaGPS);  $.get(url).done(function(results){     buscaGPS(results,i); });  function buscaGPS(data,z){   console.log(z);   objecto[z].lat=data.results[0].geometry.location.lat; }  Console: success Uncaught TypeError: Cannot set property 'lat' of undefined 0

Made a mistake and I saw it when I was editing this.

Shanimal Over a year ago

data.results[0].geometry.location is undefined... what does your result set look like? can you pastebin "data"?

hensansi Over a year ago

I made a mistake here $.get(url).done(buscaGPS); I forget to delete it. Thanks for your help. it is working now. It is shamefully simple :). The response was has you originally you write it. $.get(url).done(function(results){ buscaGPS(results,i); });

Shanimal Over a year ago

i'd be careful with your response. in your function the variable i is the last index of the iterator, not the index of the iterator when the function was called. creating a closure will store the value

hensansi Over a year ago

Yes. I never thought that I could get an answer so fast. I was in loop in this problem. Thanks.

Michael Geary · Accepted Answer · 2013-05-22 17:41:13Z

0

While Shanimal's solution is perfectly reasonable, it adds a bit of complexity to the code with the function-returning-a-function. You don't actually need that to get a closure; a simple function call will do the trick.

Consider this alternative:

for( var i = 0;  i < objecto.length;  i++ ) {
    geocode( objecto[i] );
}

function geocode( place ) {
    var url =
        "http://maps.googleapis.com/maps/api/geocode/json?address=" +
        place.address_1 + "+" + place.city + "+" + place.country +
        "&sensor=false";
    $.get(url).done( function( data ) {
        var location = data.results[0].geometry.location;
        place.lat = location.lat;
        place.lon = location.lng;
    });
}

Note that this also gets rid of all the objecto[i] and objecto[index] references, using a simple place variable to replace them.

I find this approach to be much easier to understand than a function that returns a function.

Other comments related to geocoding: Will you have a larger number of locations in your objecto array? If it's more than a few, you will need to slow down the geocoding requests instead of firing them all in a row.

Also, if these are fixed locations, you ought to geocode them once and store the lat/long in your array, so you won't have to geocode them at all in the browser. This will make your map load faster and avoid problems with geocoding multiple addresses.

answered May 22, 2013 at 17:41

Michael Geary

29k9 gold badges67 silver badges77 bronze badges

7 Comments

hensansi Over a year ago

Humm I never thought this way. Sometimes I have some difficulty understanding javascript objects. Yes when I try to understand what is happening I can't get why Shanimal can access to data using a return ( return function(data)). I still have a lot to learn.

hensansi Over a year ago

Yes, I already saw the botleneck from google api. "you won't have to geocode them at all in the browser." I dind't get very well what you were saying. Are you saying that I should geocode in the server?

Michael Geary Over a year ago

Yes, if you are dealing with a fixed set of locations, it's much better to geocode them once and be done with it. If the locations are in a database, you can add a column (or two columns) for the lat/lng and run a geocoding process on your server to populate those columns. Once that's done, you'll never have to geocode them again. If you don't know the locations ahead of time, then of course you can geocode them in the browser, but it takes longer that way.

hensansi Over a year ago

Yes, they are fixed. I have to do that. Thanks for your help.

Shanimal Over a year ago

michael, its a matter of scope i suppose. Your closure is inside your get, mine is inside callback. I think yours is somewhat cleaner approach, but only because it make use of converting the complex object into a variable "place" that makes it easier to read. At the end of the day, its the same answer. quit poaching. :) lol

|

Collectives™ on Stack Overflow

How to pass a variable inside a function inside a jquery function?

2 Answers 2

5 Comments

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related