CODEWITHSUNDEEP
javascriptjqueryhtmljson
AceSammy
AceSammy

Reputation: 3

Json data not displaying on html server

I have a micro controller that communicates between C and it's html server using json. I have two json files: status.json, and serial.json. status.json displays fine, but serial.json will not display for some reason?

I have confirmed that serial.json is displaying correctly on the html server so my issue will be from the javascript/JQuery/HTML code.

here is what /serialdata.json looks like

{"serial":"XXSerialTestXX"}

here is my jQuery/Javascript code

function getSerialData() {
    $.getJSON( "/serialdata.json", function( data ) {
        if(data.hasOwnProperty('serial') && data['serial'] != "") {
            $("#serial").text(data["serial"]);
        }
    })
}

here is my html code 

<div id="Instructions">
    <h2>Follow These Intructions to set up your device</h2>
    <section>
        <body>follow these steps to set up your device!</body>
        <div id="serial"></div>
    </section>
</div>

if i change div id to to an id I set from status.json it works fine, but the serial id from serial.json does not work, does my code look fine?

Upvotes: 0

Views: 63

Answers (2)

pellul
pellul

Reputation: 1031

Make sure that your script is calling your getSerialData() method.

With declaration

// Declare getSerialData()
function getSerialData() {
  $.getJSON('/serialdata.json', function(data) {
    if (data.hasOwnProperty('serial') && data['serial'] != "") {
      $('#serial').text(data['serial']);
    }
  });
}

// Call the function.
getSerialData();

Without declaration

If you don't need to call the function anywhere else, you can just omit the function declaration and write directly your code

$.getJSON('/serialdata.json', function(data) {
  if (data.hasOwnProperty('serial') && data['serial'] != "") {
    $('#serial').text(data['serial']);
  }
});

Upvotes: 1

Shababb Karim
Shababb Karim

Reputation: 3733

Try calling the function on the onReady event of the document. This one line below the getSerialData function declaration should do.

$(getSerialData)

Upvotes: 0

Related Questions