1

new here and hit a roadblock, been searching but can't find the answer with my skill set. Task is pretty simple, I want to parse this http://data.sparkfun.com/output/AJ2p4r8Owvt1MyV8q9MV.json which is from a weather station. I have used the W3C tutorial but just can't seem to parse this file, but http://json.parser.online.fr has no problem. All the looping parse examples just give me alert after alert.

All I want is the ability to select temp[0] (out of god knows how many) for example via javascript and have it display on a website. I'm really lost, tried searching and if I've missed the goldmine then my bad. Thanks!

Example code

var text = '[{"humidity":"42.8000","stationtime":"2014-07-06 19:43:52","temp":"23.3000","timestamp":"2014-07-06T09:44:07.918Z"},{"humidity":"‌​43.0000","stationtime":"2014-07-06 19:42:57","temp":"23.2000","timestamp":"2014-07-06T09:42:22.003Z"},{"humidity":"‌​43.2000","stationtime":"2014-07-06 19:42:36","temp":"23.3000","timestamp":"2014-07-06T09:42:51.737Z"}]';  
var obj = JSON.parse(text); 
document.getElementById("demo").innerHTML = obj.temp[0]; 
6
  • Example of what I'm trying to do <html> <body> <p id="demo"></p> <script> var text = '[{"humidity":"42.8000","stationtime":"2014-07-06 19:43:52","temp":"23.3000","timestamp":"2014-07-06T09:44:07.918Z"},{"humidity":"43.0000","stationtime":"2014-07-06 19:42:57","temp":"23.2000","timestamp":"2014-07-06T09:42:22.003Z"},{"humidity":"43.2000","stationtime":"2014-07-06 19:42:36","temp":"23.3000","timestamp":"2014-07-06T09:42:51.737Z"}]'; obj = JSON.parse(text); document.getElementById("demo").innerHTML = obj.temp[0]; </script> </body> </html> Commented Jul 6, 2014 at 11:32
  • do NOT post code in comments. Add it to the question Commented Jul 6, 2014 at 11:33
  • remove single quote from var text = '[{"humidity":"4 ..' Commented Jul 6, 2014 at 11:33
  • You should edit your question to say 'how to parse json', and not 'jsonp' as these are two different things (jsonp is a method of bypassing cross-origin restrictions). Commented Jul 6, 2014 at 11:36
  • But he needs JSONP to get at the JSON Commented Jul 6, 2014 at 11:37

2 Answers 2

2

First, you need to parse the incoming string as below:

temp_arr = JSON.parse(json_string);

Just loop over the temp_arr array, and in each iteration of loop you'll have one object (tobj). For example, like this:

{"humidity":"40.9000","stationtime":"2014-07-06 21:21:03","temp":"22.6000","timestamp":"2014-07-06T11:20:27.231Z"}

All you have to do is, access it like tobj.temp and use it to display on page.

I have written a jquery implementation at: http://jsfiddle.net/DNH5n/2/

Sign up to request clarification or add additional context in comments.

3 Comments

Hi Rajesh, thanks for the reply! Any chance you could help me with the code, putting a working example together? My knowledge is limited with Java.
this is not Java, but javascript. Both are VERY DIFFERENT.
I took a look at the jsfiddle and definitely useful for me, I'm working on charts now and think this will help a lot. Thanks!
0

Jquery makes working with JSONP much easier heres an example (http://jsfiddle.net/icodeforlove/9mBsr/)

$.getJSON('http://data.sparkfun.com/output/AJ2p4r8Owvt1MyV8q9MV.json?callback=?', function (data) {
    data.forEach(function (item) {
        $('body').append(JSON.stringify(item)); 
    });
})

update again

heres another example using your code (http://jsfiddle.net/icodeforlove/9mBsr/2/)

var text = '[{"humidity":"42.8000","stationtime":"2014-07-06 19:43:52","temp":"23.3000","timestamp":"2014-07-06T09:44:07.918Z"},{"humidity":"‌43.0000","stationtime":"2014-07-06 19:42:57","temp":"23.2000","timestamp":"2014-07-06T09:42:22.003Z"},{"humidity":"‌43.2000","stationtime":"2014-07-06 19:42:36","temp":"23.3000","timestamp":"2014-07-06T09:42:51.737Z"}]';

var obj = JSON.parse(text);

document.getElementById("demo").innerHTML = obj[0].temp;

4 Comments

Thanks Chad! So very close to what I'm after, what would I have to change in order to select just one of the temps for example? Using some kind of obj.temp[1] I'm assuiming?
your problem is that there is no obj.temp, its just obj[1], try pasting your JSON into the console wrapped in ( ). It makes it much easier to see the contents of the JSON object. (img42.com/sQVtD+ - chrome console)
Thanks Chad, that's a real bummer. So there is no easy way using the original $.getJSON method to extract the temperature from the first object? Must be close.
Brilliant! One last thing is how can I use data.sparkfun.com/output/AJ2p4r8Owvt1MyV8q9MV.json?callback=? with that second example, the var text one? As I need the page to grab the values and update automatically. Really appreciate your help, seriously got me out of a bind.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.