How can i pass parameters to a JQuery $.getJSON callback method?

Question

Hi folks,

I'm trying to use JQuery to call some custom api via Ajax/$.getJSON . I'm trying to pass a custom value into the Ajax callback method, but that value is not getting passed through and is actually getting overwritten. This is my code:-

var locationType = 3;
var url = 'blah blah blah' + '&locationType=' + locationType;
$("#loading_status").show();
$.getJSON(url, null, function(results, locationType) {
    searchResults(results, locationType)
});

now the value of locationType BEFORE i call the url using Ajax is 3. But after the Ajax returns the data successfully, the value for locationType is now success. This is because the method signature of the callback is:

callback(data, textStatus)A callback function that is executed if the request succeeds.

Hmmm. Ok. so how can i pass 1 or more parameters to a callback method, please?

Answer 1

If you want to use locationType (whose value is 3) in the callback, simply use

function(results) { .....

thanks to closures, locationType will be automatically available in the callback.

Answer 2

Warp in a function, e.g.

function getResults(locationType) {
    $.getJSON(url, null, function(results) {
        searchResults(results, locationType)
    });
}

But in you specific situation you don't even have to pass it, you can access the value directly in the callback.

Answer 3

You don't need to pass it in, just reference the variable you already have, like this:

var locationType = 3;
var url = 'blah blah blah' + '&locationType=' + locationType;
$("#loading_status").show();
$.getJSON(url, null, function(results) {
    searchResults(results, locationType)
});

Also there's no need to pass null if you don't have a data object, it's an optional parameter and jQuery checks if the second param is a function or not, so you can just do this:

$.getJSON(url, function(results) {
    searchResults(results, locationType)
});

Answer 4

You could use the .ajax method:

var locationType = 3;
var url = 'blah blah blah' + '&locationType=' + locationType;
$.ajax({
    url: url,
    context: { lt: locationType }
    success: function(results) {
        searchResults(results, this.context.lt);    
    }
});