Uncaught SyntaxError on JSONP request

Hey guys, I keep getting this error message on the console and can't print out the data. Any assistance would be greatly appreciated. Thanks

$("#search").submit(function(event){

event.preventDefault();

var userInput = $("#query").val();

getRequest(userInput);

});

function getRequest(userInput){

$.ajax({

url: "http://www.giantbomb.com/api/search",

type: "GET",

data: {

resources: "game",

query: userInput,

api_key: "8cd10a7136710c1003c8e216d85941ace5a1f00e",

format: "jsonp",

crossDomain: true,

limit: 15,

field_list: "platforms,name,image,original_release_date,site_detail_url"

},

dataType: "jsonp"

}).done(function(data){

showResults(data.results);

console.log(data);

});

}

function showResults(result){

var html = "";

$.each(result, function(index,value){

var gameName = value.name;

var boxArt = value.image.icon_url;

var releaseDate = value.original_release_date;

var platform = value.platform.name;

var site_detail = value.platform.site_detail_url;

html += "<li><p>" + gameName + "</p></li>" + "<img src=" +boxArt + ">" + "<p>" + releaseDate + "</p>" + platform + "</p>" + "<a href='" + site_detail + "'><p>Click here for more information</p></a>";

});

$("#search-results").html(html);

}

A few things are causing the issue:

• First, since you're using JSONP, your request needs to include a json_callback parameter. The value should be 'showResults', the name of your handler function.
• Second, in showResults, you need to enumerate over result.results, since there is some metadata returned as well.
• Third, there isn't always an image property set, so you need to check if "value.image" exists first.
• And fourth, the platforms property is plural e.g. value.platforms.name.

Here's a working example of your code: http://pastebin.com/ARrbCT2Q

Just put your API key where is says YOUR_API_KEY_HERE. You should also probably remove it from your post, since it serves as your API password.