78

Is there a good way to encode a JavaScript object as JSON?

I have a list of key value pairs...where the name is from a checkbox, and the value is either true or false based on whether the box is checked or not:

var values = {};
$('#checks :checkbox').each(function() { values[this.name]=this.checked; });

I want to pass these values into a JSON object so store into a cookie to render a table (Columns will be added according to what the user checks off).

Does anyone know a solution?

Brett DeWoody
  • 59,771
  • 29
  • 135
  • 184
daniel langer
  • 1,855
  • 2
  • 17
  • 20
  • 1
    There's no such thing as a json object. Are you trying to serialize values into json, or are you trying to pass values into a JavaScript object? – Adam Rackis Jun 06 '12 at 18:34
  • I want to be able to create a json file to store the values of the checkboxes so the users choices are saved in a cookie. I am new to json so I don't know whicH i want – daniel langer Jun 06 '12 at 18:36
  • 3
    possible duplicate of [storing and retrieving json objects to / from a cookie](http://stackoverflow.com/questions/5501968/storing-and-retrieving-json-objects-to-from-a-cookie), [serialize form to json and store in the cookie](http://stackoverflow.com/q/5458736/1048572) and [How do I store this JSON object as a cookie and than read it in vanilla javascript?](http://stackoverflow.com/q/3252400/1048572) – Bergi Jun 06 '12 at 19:03
  • IE7 and below need the JSON2.js library and do not support this API natively. http://caniuse.com/json – Ritsaert Hornstra Mar 13 '13 at 15:22

2 Answers2

146

I think you can use JSON.stringify: 

// after your each loop
JSON.stringify(values);
Alexander
  • 23,432
  • 11
  • 63
  • 73
mimiz
  • 2,178
  • 2
  • 14
  • 14
  • 1
    I put this in an alert() but nothing appears – daniel langer Jun 06 '12 at 18:33
  • @daniellanger - based on your comment, this is the answer. You'll need to do some debugging to see why things aren't showing up – Adam Rackis Jun 06 '12 at 18:37
  • so how can I save this to a file/ store it as a cookie? – daniel langer Jun 06 '12 at 18:39
  • and just to clarify, where should this line be? – daniel langer Jun 06 '12 at 18:40
  • ` var values = {}; $('#checks :checkbox').each(function() { values[this.name]=this.checked; }); var jsonString = JSON.stringify(values);` Then you can use [document.cookie](https://developer.mozilla.org/en/DOM/document.cookie) to create your cookie ... – mimiz Jun 06 '12 at 20:28
  • 2
    IE 10 is giving: JavaScript runtime error: 'JSON' is undefined – Matthew Lock Mar 22 '13 at 06:27
  • Completely dependent on if your browser supports JSON objects. IE is notorious for not supporting the JSON.xxx() protocol. Be careful because if you're trying to support older browsers, you'll need a TRY/CATCH statement just to use JSON.strinify() with IE10 or less. – Michael Feb 28 '14 at 04:45
  • 1
    [The native JSON methods are supported by IE8 and above](http://caniuse.com/json). That being said, [in IE they are only available in Standards Mode](http://stackoverflow.com/questions/10219398/json-is-undefined-issue-in-ie-but-not-chrome). – Boaz May 14 '14 at 13:13
42

All major browsers now include native JSON encoding/decoding.

// To encode an object (This produces a string)
var json_str = JSON.stringify(myobject); 

// To decode (This produces an object)
var obj = JSON.parse(json_str);

Note that only valid JSON data will be encoded. For example:

var obj = {'foo': 1, 'bar': (function (x) { return x; })}
JSON.stringify(obj) // --> "{\"foo\":1}"

Valid JSON types are: objects, strings, numbers, arrays, true, false, and null.

Some JSON resources:

vezult
  • 5,185
  • 25
  • 41
  • 1
    Well, they are called "objects" in javascript. But yes, boolean values can be represented in JSON. – vezult Jun 06 '12 at 19:16