0

I am new to JSON and I used json_encode to create a JSON object that looks like this

[{
      "timestamp": "12\/16\/2013 0:00",
      "curr_property": "7211",
      "curr_property_cost": "123",
      "day_property": "48",
      "day_property_cost": "281",
      "curr_solar_generating": "4958",
      "curr_solar_export": "0",
      "day_solar_generated": "33",
      "day_solar_export": "0",
      "curr_chan1": "1964",
      "curr_chan2": "4958",
      "curr_chan3": "289",
      "day_chan1": "13",
      "day_chan2": "33",
      "day_chan3": "1"
  }, {
      "timestamp": "12\/16\/2013 0:00",
      "curr_property": "7179",
      "curr_property_cost": "123",
      "day_property": "72",
      "day_property_cost": "281",
      "curr_solar_generating": "4926",
      "curr_solar_export": "0",
      "day_solar_generated": "49",
      "day_solar_export": "0",
      "curr_chan1": "1980",
      "curr_chan2": "4926",
      "curr_chan3": "273",
      "day_chan1": "19",
      "day_chan2": "49",
      "day_chan3": "2"
  }, {
      "timestamp": "12\/16\/2013 0:00",
      "curr_property": "9627",
      "curr_property_cost": "165",
      "day_property": "104",
      "day_property_cost": "282",
      "curr_solar_generating": "4749",
      "curr_solar_export": "0",
      "day_solar_generated": "65",
      "day_solar_export": "0",
      "curr_chan1": "1980",
      "curr_chan2": "4749",
      "curr_chan3": "2898",
      "day_chan1": "26",
      "day_chan2": "65",
      "day_chan3": "12"
  }, {
      "timestamp": "12\/16\/2013 0:00",
      "curr_property": "9610",
      "curr_property_cost": "165",
      "day_property": "136",
      "day_property_cost": "282",
      "curr_solar_generating": "4781",
      "curr_solar_export": "0",
      "day_solar_generated": "81",
      "day_solar_export": "0",
      "curr_chan1": "1980",
      "curr_chan2": "4781",
      "curr_chan3": "2849",
      "day_chan1": "32",
      "day_chan2": "81",
      "day_chan3": "21"
  }, {
      "timestamp": "12\/16\/2013 0:01",
      "curr_property": "9691",
      "curr_property_cost": "166",
      "day_property": "168",
      "day_property_cost": "283",
      "curr_solar_generating": "4797",
      "curr_solar_export": "0",
      "day_solar_generated": "97",
      "day_solar_export": "0",
      "curr_chan1": "1996",
      "curr_chan2": "4797",
      "curr_chan3": "2898",
      "day_chan1": "39",
      "day_chan2": "97",
      "day_chan3": "31"
  }, {
      "timestamp": "12\/16\/2013 0:01",
      "curr_property": "7034",
      "curr_property_cost": "120",
      "day_property": "191",
      "day_property_cost": "283",
      "curr_solar_generating": "4781",
      "curr_solar_export": "0",
      "day_solar_generated": "113",
      "day_solar_export": "0",
      "curr_chan1": "1980",
      "curr_chan2": "4781",
      "curr_chan3": "273",
      "day_chan1": "46",
      "day_chan2": "113",
      "day_chan3": "32"
}]

I have tried to parse the data using the script below

$(document).ready(
        function() {
            var jsonData = JSON.parse("<?php echo $jsondata; ?>");  
            console.log(jsonData.timestamp[0]);             

    });

I don't know what I am doing wrong here. I do know that an has a length of 0 by default in javascript, so how do I get the value? BTW var_dump on the $jsondata gives out the data

Purushotham
  • 3,770
  • 29
  • 41
Bazinga777
  • 5,140
  • 13
  • 53
  • 92

3 Answers3

6

Your JSON data includes " characters. You are trying to inject it into a JavaScript string literal that is delimited with " but you aren't escaping the " characters in the data.

Your JSON also includes new lines, literal new lines are not allowed in JavaScript strings, so you need to replace them with escape sequences (\n) too.

That said, JSON is a subset of JavaScript literal syntax, so you don't need to go to the effort of converting a JSON text into a JavaScript string literal and then parsing it, you can simply use the JSON as JavaScript:

var data = <?php echo $jsondata; ?>;

You have another problem. Your JSON data represents an array of objects, not an object that has arrays as property values. You need to access the array before the property name: data[0].timestamp.

Quentin
  • 914,110
  • 126
  • 1,211
  • 1,335
  • Okay, what is it with people upvoting this answer and not mine? I was faster on the single quotes and array access answers, but this guy gets the votes because of 288k rep? – Cerbrus Feb 18 '14 at 09:07
  • 2
    @Cerbrus: No, simply because it's a better answer. Why would use `JSON.parse` if you don't have to? Your solutions isn't even reliable: what happens if the JSON data contains a `'`? – Felix Kling Feb 18 '14 at 09:07
  • @Cerbrus If you are doing it for the reps, you are doing it for the wrong reasons man. I am here on S/O for like 4 years. It's a fun place to help out people. No competition. – Shouvik Feb 18 '14 at 09:08
  • @Shouvik: Some recognition for a answer would be nice. FelixKling: I didn't think about that, that's a fair point. – Cerbrus Feb 18 '14 at 09:09
  • I have used that too , now I get a Uncaught TypeError: Cannot read property '0' of undefined error. Could it be that the JSONData is so large that the data doesn't exist when I pass it to the javascript But then again I user document.ready. please advise – Bazinga777 Feb 18 '14 at 09:10
  • 1
    @Bazinga777 — Sounds like you haven't dealt with the problem described in the final paragraph of this answer. – Quentin Feb 18 '14 at 09:12
  • 1
    @Bazinga777: *"Could it be that the JSONData is so large that the data doesn't exist"* No, the client receives the complete source before it executes it. This has nothing to do with `document.ready` either. – Felix Kling Feb 18 '14 at 09:13
  • @Quentin: No, that rather sounds like `data` is `undefined`, which seems like a different issue. – Felix Kling Feb 18 '14 at 09:13
  • @FelixKling — Could be either. – Quentin Feb 18 '14 at 09:14
  • Thanks, guys. I solved it. I was wrong about using "" but I got my main answer solved by another user. I will upvote for the right suggestions and select the other answer as the right answer. – Bazinga777 Feb 18 '14 at 09:15
  • @Quentin: Oh right, I didn't notice that the OP had `.timestamp[0]`. My bad! – Felix Kling Feb 18 '14 at 09:18
2

Try using single quotes here:

var jsonData = JSON.parse("<?php echo $jsondata; ?>");

Replace that with:

var jsonData = JSON.parse('<?php echo $jsondata; ?>');

Because the $jsondata contains double quotes ("), the string passed to JSON.parse() will be broken, resulting in invalid JavaScript.

However, as Quentin answered, the whole JSON.parse is unnecessary.
Like he answered, use: var data = <?php echo $jsondata; ?>;

Also, you're accessing the object incorrectly:

jsonData.timestamp[0];

Should be:

jsonData[0].timestamp;

your JSON is a array of timestamp objects, so use the array index [0], first.

Community
  • 1
  • 1
Cerbrus
  • 70,800
  • 18
  • 132
  • 147
  • That's not sufficient, the JSON includes new lines too. – Quentin Feb 18 '14 at 09:03
  • @Quentin: OP used `json_encode`, that should return a valid JSON string without the newlines. I believe that's just a formatting mistake from asking the question. – Cerbrus Feb 18 '14 at 09:05
  • Perhaps the pretty print options were used? – Quentin Feb 18 '14 at 09:05
  • You have my upvote! I hope you keep contributing for more reasons than just votes though! :) – Shouvik Feb 18 '14 at 09:14
  • @Shouvik: It's not the points that are bugging me. It's the way the vote system is sometimes played. Or answers that are absolute bollocks getting a early +1, and people just joining in on that +1 because that answer was the only one with votes at the moment (Which wasn't the case here, the other answer is indeed better) – Cerbrus Feb 18 '14 at 09:17
  • @Cerbrus people upvote answers of people they follow blindly because they feel the need to upvote that person. They are expressing `thank-yous` for posts on another answer. The problem is S/O limits the points you can upvote an answer. Anymore and you will have to issue a bounty and award the person from your points. People prefer not to follow that ideology. No point complaining. No system is foolproof. – Shouvik Feb 18 '14 at 09:22
1

You are calling console.log(jsonData.timestamp[0]); which basically means, inside jsonData find property timestamp which is an array and get the first index.

But jsonData is the array, not timestamp. You should probably go with something like console.log(jsonData[0].timestamp);

Florian F.
  • 4,700
  • 26
  • 50
  • I didn't know this part so thanks a lot, will select it as the right answer after 2 minutes – Bazinga777 Feb 18 '14 at 09:12
  • 1
    @Bazinga777: I wonder how this works for you, given that `var jsonData = JSON.parse("");` should produce invalid JavaScript. – Felix Kling Feb 18 '14 at 09:18
  • I replaced "" with '' – Bazinga777 Feb 18 '14 at 09:19
  • $(document).ready( function() { var jsonData = ; console.log(jsonData[0].timestamp); }); also worked – Bazinga777 Feb 18 '14 at 09:20
  • 1
    @Bazinga777: Using `'` instead of `"` will work as long as your data won't contain any `'`. It looks like your data is mostly numerical, so you will be fine for now. Note though that `var jsonData = ;` is still the superior solution. – Felix Kling Feb 18 '14 at 09:25