Question

I have this jquery code:

var baseURl = 'http://www.testdomain.com';
bindItemImage("230015");

function bindItemImage(_itemCode) {
  $.ajax({
    url: baseURl + 'v3/api/itemimage/' + _itemCode,
    type: 'GET',
    contentType: "application/json;charset=utf-8",
    success: function (data) {
        var item = $.parseJSON(data);
       var file = baseURl + item.File;
       $('.itemPhoto').attr('src', file);
    }
   });

}

it displays the image just fine in firefox but not in IE or chrome.
Chrome and IE return the right data but I get a JS error message “Cannot read property ‘File’ of null”

here is the JS fiddle
http://jsfiddle.net/C8Xjy/3/

Thank you

Answer 1

When you’re expecting a json response you set dataType to "json", using contentType: "application/json;charset=utf-8", is for when you’re sending json in your request. Also when you specify json as the data type it will already be parsed when passed to the success handler.

$.ajax({
  url: baseURl + 'v3/api/itemimage/' + _itemCode,
  type: 'GET',
  dataType: "json",
  success: function (data) {
    var file = baseURl + data.File;
    $('.itemPhoto').attr('src', file);
  }
});

DEMO