jQuery JSON parse unexpected character

Question

I basically read some sensor data and this data gets written to a JSON file. I'm trying to show these readings on a web page but I have as good as no previous experience with jQuery. My measurements.json file contains exactly the same as the commented output var. However when i use the commented line it works. But it does not work when i run the code like here;

<script type="text/javascript">
jQuery(document).ready(function(){

    $("#json").load('measurements.json');

    //var output = jQuery.parseJSON('{"timestamp": 1391524099.334835, "pH": 1.4132352941176471, "Temperature": -14.934640522815688, "Chlorine": 999.0},');

    var output = jQuery.parseJSON("#json");

    $('#celc').append(String(output.Temperature));
    $('#cl').append(output.Chlorine);
    $('#ph').append(output.pH);

});
</script>

<div id="json"><strong>JSON</strong>: </div>
<div id="celc"><strong>Temperatuur</strong>: </div>
<div id="cl"><strong>Chloor</strong>: </div>
<div id="ph"><strong>Zuur</strong>: </div>

Im probably doing something obvious wrong but i cant seem to figure it out using just Google.

Thanks!

You're probably trying to parse the json before the data was actually loaded. — NG.
– NG., Commented Feb 4, 2014 at 18:10

Satpal · Accepted Answer · 2014-02-04 19:48:50Z

4

You should use $.getJSON().

$.getJSON( 'measurements.json' function(data){
    $('#celc').append(String(data.Temperature));
    $('#cl').append(data.Chlorine);
    $('#ph').append(data.pH);
}).error(function() { alert("error"); });

.load() is called asynchronously. Thus when you call jQuery.parseJSON("#json"); it contains <strong>JSON</strong>: which is invalid JSON thus you are getting exception

edited Feb 4, 2014 at 19:48

answered Feb 4, 2014 at 18:12

Satpal

134k13 gold badges168 silver badges171 bronze badges

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

1 Comment

broodrooster Over a year ago

Thanks for the useful comment. I'm not getting any errors any more! What I don't understand is that my <div id>'s now don't get append. Or maybe it does but its just empty text. Is there a way to check or solve this?

Collectives™ on Stack Overflow

jQuery JSON parse unexpected character

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related