2

The code below get's Json object from a URL in a loop.

Problem is I cannot seem to display returned Json data. I want to display the Temperature and Humidity from the object.

Valid Json objects are returned OK, but i cannot display it in HTML div.

I see nothing printed to screen.

FULL CODE:

<html>
<head>
<title>json loop</title>
</head>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js">
</script>

    <div id="container">
    <div id="div"></div>
        <div id="output">nothing yet</div>
    </div>

<script>
    var previous = null;
    var current = null;
    var data;
    setInterval(function() {
        $.getJSON(
            "https://dweet.io/get/latest/dweet/for/myesp8266", 
            function(json) {
                data = json; 
                current = JSON.stringify(data); 
                $("div").html(data);
                console.log(data);           
                if (previous && current && previous !== current) {
                    console.log('refresh');
                    location.reload();
                }
                previous = current;
        });                       
    }, 2000);   


var output = document.getElementById('output');
output.innerHTML = data ;

</script>
</body>
</html>
Robert Brown
  • 23
  • 5

2 Answers2

0

have you tried it like this ?

setInterval(function() {
    $.getJSON("https://dweet.io/get/latest/dweet/for/myesp8266", 
    function(json) {
        data = json; 
        current = JSON.stringify(data); 
        //$("div").html(data);
        console.log(data);           
        if (previous && current && previous !== current) {
            console.log('refresh');
            location.reload();
        }
        previous = current;
        var output = document.getElementById('output');
        output.innerHTML = current ;
    });                       
}, 2000);

Edit:

here is an example on how this may work: https://plnkr.co/edit/GI5uzojOOmJNwAc73aXq?p=preview

Andrei Neagu
  • 898
  • 8
  • 25
0

You are not putting the stringified string to the HTML. Use current and not data ?

data = json; 
current = JSON.stringify(data); 
$("div").html(current);
console.log(current);           
if (previous && current && previous !== current) {
    console.log('refresh');
    location.reload();
}
previous = current;

EDIT

If you want the temperature, use :

$("div").html(data.with[0].content.temperature);
Alteyss
  • 513
  • 3
  • 17