json from another domain using jquery

Question

Sorry if this is a repeat, but I couldnt find the answer on any of the related threads. I am trying to get a json from an api and read the contents, but having trouble parsing. The code is below. I am using jsonp, since json does not work cross domain.

function getBbyJson()
{
    link = "http://api.remix.bestbuy.com/v1/products(name=playbook*)?show=sku,name,regularPrice,shortDescription&format=json&apiKey="+apikey
    $(document).ready(function(){
        $.ajax({
            type: "GET",
            url: link,
            dataType: "jsonp", 
            success: function(data){
                for (var i = 0,len = data.products.length; i < len; i++) {
                    var name = data.products[i].name;
                    $('<div class="name" id="item_'+i+'"></div>').html(name).appendTo('#container');                        
                }
            } 
        });
    });
}

using this function, bby returns a 400 error with the following message

"Couldn't understand '/v1/products(name=playbook*)?show=sku,name,regularPrice,shortDescription&format=json&apiKey=apikey&callback=jQuery17206852765618823469_1341853386681&_=1341853391235'"

the jquery method is adding a callback function, and a random number at the end.

I can remove the callback function by add the code below

jsonp: false
jsonpCallback: ""

But, I cant get rid of the random number generated by jquery. I am not sure how to proceed from here. I used the same function on a local json file and it worked without a hitch.

The return json from bby if I paste the link in the browser is below

{
  "queryTime": "0.005",
  "currentPage": 1,
  "totalPages": 2,
  "partial": false,
  "from": 1,
  "total": 15,
  "to": 10,
  "products": [
    {
      "name": "BlackBerry - Leather Sleeve for BlackBerry PlayBook Tablets - Black",
      "shortDescription": "From our expanded online assortment; designed for use with BlackBerry PlayBook tablets; premium-grade leather material; access to ports; reinforced panels",
      "regularPrice": 49.99,
      "sku": 2638153
    },
    {
      "name": "BlackBerry - PlayBook Tablet with 16GB Memory",
      "shortDescription": "BlackBerry PlayBook Tablet operating system7\" HD capacitive screen with multi-touchWi-Fi16GB memorySupports all POP e-mail services",
      "regularPrice": 199.99,
      "sku": 2265381
    },
    {
      "name": "BlackBerry - PlayBook Tablet with 32GB Memory",
      "shortDescription": "BlackBerry PlayBook Tablet operating system7\" HD capacitive screen with multi-touchWi-Fi32GB memorySupports all POP e-mail services",
      "regularPrice": 249.99,
      "sku": 2387032
    },
    {
      "name": "BlackBerry - PlayBook Tablet with 64GB Memory",
      "shortDescription": "BlackBerry PlayBook Tablet operating system7\" HD capacitive screen with multi-touchWi-Fi64GB storage memorySupports all POP e-mail services",
      "regularPrice": 299.99,
      "sku": 2387041
    },
    {
      "name": "BlackBerry - Rapid Charger for BlackBerry PlayBook",
      "shortDescription": "From our expanded online assortment; compatible with BlackBerry PlayBook tablets; 90&#176; magnetic connector; compact design",
      "regularPrice": 69.99,
      "sku": 2638199
    },
    {
      "name": "BlackBerry - Rapid Charger for BlackBerry PlayBook Tablets - Black",
      "shortDescription": "Compatible with BlackBerry PlayBook tablets; charges PlayBook battery; holds PlayBook upright for viewing; magnetically connects to PlayBook",
      "regularPrice": 69.99,
      "sku": 2496254
    },
    {
      "name": "BlackBerry - Refurbished PlayBook Tablet with 16GB Memory - Black",
      "shortDescription": "RefurbishedBlackBerry PlayBook Tablet operating system7\" HD capacitive screen with multitouchWi-Fi16GB memorySupports all POP e-mail services",
      "regularPrice": 159.99,
      "sku": 4063218
    },
    {
      "name": "BlackBerry - Silicone Skin for BlackBerry PlayBook Tablets - Black",
      "shortDescription": "From our expanded online assortment; compatible with BlackBerry PlayBook tablets; silicone material; play-through design",
      "regularPrice": 29.99,
      "sku": 2638162
    },
    {
      "name": "Hip Street - AC/Car Power Adapter Kit for BlackBerry PlayBook Tablets",
      "shortDescription": "Compatible with BlackBerry PlayBook tablets and other devices with a USB charging cable; LED indicator light; USB charging cable; overcurrent protection",
      "regularPrice": 39.99,
      "sku": 3894198
    },
    {
      "name": "Hip Street - Antifingerprint Screen Protector for BlackBerry PlayBook Tablets - Clear",
      "shortDescription": "Compatible with BlackBerry PlayBook tablets; high-quality optical enhanced film; antiscratch hard coating; residue-free adhesive",
      "regularPrice": 19.99,
      "sku": 3894082
    }
  ],
  "canonicalUrl": "/v1/products(name=\"playbook*\")?show=sku,name,regularPrice,shortDescription&format=json&apiKey=ydpyq9h9cmpmzaakbawv9mzk",
  "totalTime": "0.022"
}

any help is appreciated.

-1 "the jquery method is adding a callback function, and a random number at the end." That's what it's supposed to do. Please research a little more before asking questions. For example, see jQuery.ajax() documentation. — merv
– merv, Commented Jul 9, 2012 at 18:08

Community · Accepted Answer · 2013-11-07 10:21:46Z

1

maybe this can help you: http://wiki.asp.net/page.aspx/1734/jquery-cross-domain-ajax-call-using-jsonp/

function getBbyJson()
{
    var link = "http://api.remix.bestbuy.com/v1/products(name=playbook*)";
    $(document).ready(function(){
        $.ajax({
            type: "GET",
            url: link,
            crossDomain: true,
            contentType: "application/json; charset=utf-8",
            data: { show: "sku,name,regularPrice,shortDescription",
                    apiKey:apikey},
            dataType: "jsonp", 
            success: function(data){
                for (var i = 0,len = data.products.length; i < len; i++) {
                    var name = data.products[i].name;
                    $('<div class="name" id="item_'+i+'"></div>').html(name).appendTo('#container');                        
                }
            } 
        });
    });
}

edited Nov 7, 2013 at 10:21

CommunityBot

11 silver badge

answered Jul 9, 2012 at 17:29

Justin wong

6386 silver badges15 bronze badges

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

1 Comment

fsiddiq Over a year ago

thanks, this definitely helped! I also had to add "cache: true" and that took care of it!

Isaac Gonzalez · Accepted Answer · 2012-07-09 17:29:45Z

1

Try adding to your code:

$.ajax({
            type: "GET",
            url: link,
            dataType: "jsonp", 
            success: function(data){
                for (var i = 0,len = data.products.length; i < len; i++) {
                    var name = data.products[i].name;
                    $('<div class="name" id="item_'+i+'"></div>').html(name).appendTo('#container');                        
                }
            }
            error : function(data){
                      console.log(data);
                     }
        });

And see what outputs

answered Jul 9, 2012 at 17:29

Isaac Gonzalez

1,7341 gold badge16 silver badges22 bronze badges

Collectives™ on Stack Overflow

json from another domain using jquery

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related