Processing JSON string gives JavaScript error

Question

As part of a Project Management application I am building, each Project Task will have a panel that shows Events and COmments for that particular task record. These Events will be returned as a JSON result from the Server from an AJAX request to get them.

Below is just a quick JavaScript test for loading a mockup JSON string which consist of 3 test Event records.

It should load them from the string, the live app will load them from an AJAX call.

It will then iterate over the results and do inject them into the page DOM.

My problem is the code below is showing this error in the console....

Uncaught SyntaxError: Unexpected token o

Below is the sample code that is producing the error message and also here is a JSFiddle/JSBin demo to see the live problem.... http://jsbin.com/zusehaxeya/1/edit?js,output

var sampleJsonData = {
    "task_events": [{
        "commentId": 100000000,
        "projectId": 100000000,
        "taskId": 100000000,
        "userId": 100000000,
        "created_at": "2009-02-15",
        "event_type": "Task Completed",
        "userName": "Edward White",
        "description": "Ut Excepteur dolor sed magna in sed cupidatat eu cupidatat voluptate velit ut Lorem amet, Excepteur fugiat et labore velit cupidatat nisi sunt laboris tempor in velit dolore velit fugiat do irure anim consequat. Ut nisi magna proident, quis incididunt pariatur. cupidatat sunt nulla reprehenderit exercitation mollit Duis aliqua. officia id minim irure ad deserunt ipsum"
    }, {
        "commentId": 100000001,
        "projectId": 100000001,
        "taskId": 100000001,
        "userId": 100000001,
        "created_at": "2007-04-07",
        "event_type": "Project File Uploaded",
        "userName": "Christopher Perez",
        "description": "consectetur consequat. tempor do quis voluptate proident, est irure exercitation tempor cillum ut Lorem et veniam, Excepteur elit, reprehenderit laborum enim occaecat esse magna eiusmod sit voluptate Lorem enim incididunt cillum quis est Duis proident, anim Excepteur dolore in eu tempor aliqua."
    }, {
        "commentId": 100000002,
        "projectId": 100000002,
        "taskId": 100000002,
        "userId": 100000002,
        "created_at": "1975-06-20",
        "event_type": "Task Deleted",
        "userName": "Paul Anderson",
        "description": "pariatur. in consequat. officia ex irure velit"
    }]
};


// Parse JSON data var
var taskEventsJson = $.parseJSON(sampleJsonData);
var task_events = taskEventsJson.task_events;

// Loop over each Task Event record returned
$.each(task_events, function(i, event){
  console.log(event.commentId);
  console.log(event.created_at);

  //now json variable contains data in json format
  //let's display a few items
  $('#results').append('Comment ID: ' + event.commentId + '<br />Created DateTime: ' + event.created_at);


});

And this one has a really nice explanation: http://stackoverflow.com/a/19239384/218196 — Felix Kling, Apr 08 '15 at 20:06

Oleksandr T. · Accepted Answer · 2015-04-08T19:36:42.747

4

sampleJsonData is not JSON String. In our case you don't need use parseJSON. You should use parseJSON when you have JSON string, and want to convert it to JavaScript object, Like this

var sampleJsonData = '{"x": 1}';
$.parseJSON(sampleJsonData);

edited Apr 08 '15 at 19:36

answered Apr 08 '15 at 19:32

Oleksandr T.

76,493
17
173
144

Thanks for clarifying that. The confusion came from my live version returning an actual JSON string from AJAX call and my demo not using a real string....makes more sense now, thank you! – JasonDavis Apr 08 '15 at 19:35

score 1 · Answer 2 · answered Apr 08 '15 at 19:32

1

Your sampleJsonData is a JavaScript object, not a JSON string.

answered Apr 08 '15 at 19:32

uncoder

1,818
1
17
20

Processing JSON string gives JavaScript error

2 Answers2