How to load JSON feature in Javascript for IE8?

Question

I am trying to load JSON feature in JavaScript for IE8 in a comparability mode.

I was advised to use douglascrockford/JSON-js to get JSON loaded in obsolete browsers.

Here is what I have done. I added a new file in my resources folder and called it json2.js Then from the JSON-js project I copied the json2.js file content and pasted it into my json2.js file and included the file resources/json2.js into my app.

Now, I am trying to use JSON.stringify to convert an object into json string which is giving me the following error

But when I use JSON.stringify(records) in IE8 under compatibility mode I get this error

Line: 314
Char: 21
Error: Invalid procedure call or argument
Code: 0

Here is what I have done

HTML Markup

<div id="d">Click Here</div>
<div id="s"></div>

Javascript code

var records = {};


$(function(e){

   records['123'] = {};
   records['456'] = {};

   records['123']['rec_id'] = 4456;
   records['123']['created_at'] = '';
   records['123']['assigned_at'] = '';
   records['123']['sys_id'] = 1745;

   records['456']['rec_id'] = 4456;
   records['456']['created_at'] = '';
   records['456']['assigned_at'] = '';
   records['456']['sys_id'] = 1745;


   $.each(records, function(callID, record){

            record['campaign_id'] = '1';
            record['offset'] = 123;
            record['attempt'] = '7';
            record['phone'] = '800-123-4567';
            record['identity'] = 123;
            record['code'] = 'Some Code';
            record['notes'] = 'Some notes';
            record['completed_by'] = 'Mike A';
            record['name'] = null;

            record['completed_at'] = "";

   });


   $('#d').click(function(e){
        $('#s').text(  JSON.stringify(records)  );
   });

});

the above code can be found in the following jFiddle https://jsfiddle.net/4632wf5n/

What can I do to convert my object into json string in IE8 with comparability mode?

Answer 1

Although according to Mozilla Developer Network (MDN) , JSON.stringify is supported in IE8 , in case if it's not, then you can use the polyfill (ie if it's not supported by browser, then use custom implementation). If Douglas JSON.js is not working then, MDN also provides a code for the polyfill, and I have copied that here. Just insert it before any other scripts, and JSON.stringify would work in IE6+ browsers where it's not supported.

if (!window.JSON) {
  window.JSON = {
    parse: function(sJSON) { return eval('(' + sJSON + ')'); },
    stringify: (function () {
      var toString = Object.prototype.toString;
      var isArray = Array.isArray || function (a) { return toString.call(a) === '[object Array]'; };
      var escMap = {'"': '\\"', '\\': '\\\\', '\b': '\\b', '\f': '\\f', '\n': '\\n', '\r': '\\r', '\t': '\\t'};
      var escFunc = function (m) { return escMap[m] || '\\u' + (m.charCodeAt(0) + 0x10000).toString(16).substr(1); };
      var escRE = /[\\"\u0000-\u001F\u2028\u2029]/g;
      return function stringify(value) {
        if (value == null) {
          return 'null';
        } else if (typeof value === 'number') {
          return isFinite(value) ? value.toString() : 'null';
        } else if (typeof value === 'boolean') {
          return value.toString();
        } else if (typeof value === 'object') {
          if (typeof value.toJSON === 'function') {
            return stringify(value.toJSON());
          } else if (isArray(value)) {
            var res = '[';
            for (var i = 0; i < value.length; i++)
              res += (i ? ', ' : '') + stringify(value[i]);
            return res + ']';
          } else if (toString.call(value) === '[object Object]') {
            var tmp = [];
            for (var k in value) {
              if (value.hasOwnProperty(k))
                tmp.push(stringify(k) + ': ' + stringify(value[k]));
            }
            return '{' + tmp.join(', ') + '}';
          }
        }
        return '"' + value.toString().replace(escRE, escFunc) + '"';
      };
    })()
  };
}