CODEWITHSUNDEEP
jqueryajaxjsonp
tausch86
tausch86

Reputation: 103

jsonpCallback not calling function

Here's my jquery snippet that I can't get to work. I'm trying to call blackBackground() through jsonpCallback

$(document).ready(function()
{


    function blackBackground(data, status)
    {
        console.log("black background");
            //I want to eventually change the body style to black
    }

    $.ajax({
        url: 'http://localhost:3000/someurl',
        dataType: 'jsonp',

        jsonp: false,
        jsonpCallback: 'blackBackground'
    });

});

Update:

jsonpCallback: 'blackBackground'

to

jsonpCallback: blackBackground

along with moving blackBackground to global scope. Thanks for all the responses.

Upvotes: 1

Views: 4932

Answers (4)

Mark Schultheiss
Mark Schultheiss

Reputation: 34168

Take off the single quotes

jsonpCallback: blackBackground

Upvotes: 2

subhaze
subhaze

Reputation: 8855

dataType: "jsonp"

Is Not a valid dataType. To do jsonp you need to add callback=? to the URL query string

url: 'http://localhost:3000/someurl?callback=?',

Upvotes: 1

Jørgen
Jørgen

Reputation: 9130

The problem here is that the function blackBackground is not available in the global scope.

You can either expose the function in the global scope by declaring it like this:

window.blackFunction = function(){ .. }

...or use an anonymous function in the ajax configuration:

jsonpCallback: function(result){ .. }

I'd recommend the latter, as it will keep you global scope tidy a wee bit longer :)

Upvotes: 4

Kevin B
Kevin B

Reputation: 95022

"Here's my JSONP"

that's JSON, not JSONP.

Since you specified jsonp: false, you need to define the callback on the global scope yourself.

function blackBackground(data, status)
{
    console.log("black background");
        //I want to eventually change the body style to black
}
// document ready isn't really needed here either, but you can make that choice.
$(document).ready(function()
{   
    $.ajax({
        url: 'http://localhost:3000/someurl',
        dataType: 'jsonp',
        jsonp: false,
        jsonpCallback: 'blackBackground'
    });

});

and your server should respond with:

blackBackground({
    "name": "async-poll",
    "description": "api for asynchronous polls",
    "version": "0.0.1",
    "dependencies": {
        "express": "3.x"
    }
})

Upvotes: 2

Related Questions