JavaScript AJAX Basics (retiring) Programming AJAX Processing JSON Data

Mohammed Ajaz
Mohammed Ajaz
5,541 Points

My code isn't doing anything, not even giving me a console log, here is the code I'm playing around with , thank you.

nothing is going on, i cant even get a console.log back? <script src="js/widget.js"></script> I've got this in the head of the html too

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {
 if(xhr.readyState === 4) {
    var employees = JSON.parse(xhr.responseText);
    var statusHTML = '<ul class="bulleted">';
   for(var i = 0; i < employees.length; i+= 1) {
    if(employees[i].inoffice === true) {
        statusHTML += '<li class="in">'; 
      } else {
        statusHTML += '<li class="out">'; 
      }
     statusHTML += employees[i].name;
     statusHTML += '</li>';
   }
   statusHTML = '</ul>';
   document.getElementById('employeeList').innerHTML = statusHTML;
 }
};
xhr.open('GET', 'data/employees.json');
xhr.send();

1 Answer

Steven Parker
Steven Parker
177,888 Points

On line 15 of "widget.js", the value of "statusHTML" is being replaced with a closing ul tag. No script errors occur, and the resulting HTML error does not cause anything to be displayed.

You probably intended to use a concatenating assignment there ("+=").

In tracking down this kind of problem, it can be useful to temporarily add "debugger" and/or "console.log" statements at points in the code related to the issue.