JSON string to object problem


I have a valid JSON string

This is taken from the output from console.log() below.

          {"action":"test1 ","count":1},

tested here

I am passing this into JS and trying to create an object from it

            var json2 = JSON.parse(data2);       //<< data2 coming from a hidden form field.
            console.log(json2);                  //<< json2 outputs as a string

Any ideas why I cant create an object from this?

Hi David,

It should work. I’ve set up a working example in jsfiddle, so you can compare it with what you’re doing and see if there are any differences.

I’m trying it on my local machine. I’m getting an error: “SyntaxError: JSON.parse: unexpected character”.

I am producing this format from PHP…

    "1": {
        "action": "test1",
        "count": 1
    "2": {
        "action": "test2",
        "count": 2
    "3": {
        "action": "test3",
        "count": 1
    "4": {
        "action": "test4",
        "count": 2
    "5": {
        "action": "test5",
        "count": 1

Storing it in a hidden field after encoding it from a PHP method.

return json_encode($JSON);

Grabbing it in JS.

var data2 = $('#jsonVals2').val();

Converting it to an object using.

var json2 = JSON.parse(data2);

Testing it using…

alert(typeof json2);

This is still outputting as a string!!

Here’s an odd thing. If I JSON.stringify() it, first, then JSON.parse() it, no problem. (Object {actlist=[5]})

David, are you able to share the link to the page with the problem? Seeing the code in context might make things easier.

Sorry fretburner Its a restricted app

Here is the actual code extracted from app…

hidden field value after php json_encode() has been at it.

<input type="hidden" id="jsonVals2" value='"{\\"1\\":{\\"action\\":\\"test1 \\",\\"count\\":1},\\"2\\":{\\"action\\":\\"test2\\",\\"count\\":2},\\"3\\":{\\"action\\":\\"test3\\",\\"count\\":1},\\"4\\":{\\"action\\":\\"test4\\",\\"count\\":2},\\"5\\":{\\"action\\":\\"test5\\",\\"count\\":1}}"' />  

JS code.

       var data2 = $('#jsonVals2').val();                  //<< get string from above
        if(data2.length){                                  //<< check it has something in it

            var json2 = JSON.parse(data2);                //<< convert to object
            alert(typeof json2);                          //<< test for type (currently === STRING)

            console.log(json2);                         //<< output to console. (see below)
           // more code here (not relevant).

Here is the JSON above output to the console from within JS. Notice the escaped quotes have been removed after JS has been at it. This validates as a well formed JSON string here

{"1":{"action":"test1 ","count":1},"2":{"action":"test2","count":2},"3":{"action":"test3","count":1},"4":{"action":"test4","count":2},"5":{"action":"test5","count":1}} 

I am about to do the Karate Kid Crane on it!!!

Your string is quoted twice. If you open up your browser’s console and run JSON.parse(json2) a second time, you’ll get an object as the output.

An easier way to go about this is just to have PHP output the JSON directly into a JS variable:

    var myObj = <?php echo json_encode($data) ?>;

Ah cheers

Been on this for hours!