Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript AJAX Basics (retiring) Programming AJAX Processing JSON Data

Humberto Ventura
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Humberto Ventura
Front End Web Development Techdegree Graduate 14,734 Points
Posted by Humberto Ventura
.a{fill-rule:evenodd;}techdegree seal-36
Humberto Ventura
Front End Web Development Techdegree Graduate 14,734 Points

Does not work

I did as Dave told me, my widget.js script does not have any error - I check it by using the Chrome console - and still the list just won't appear. What is going on?

Steven Parker
Steven Parker
229,783 Points
Steven Parker
Steven Parker
229,783 Points

If you show your code perhaps someone can help find the issue. A good way to do that is to make a snapshot of your workspace (if you're using one) and post the link to it here.

Dean Paterson
Dean Paterson
12,996 Points
Dean Paterson
Dean Paterson
12,996 Points

Did this course recently and pretty sure i had the same issue! As Steven says ... show us your code And also, are you using workspaces or your own editor? ( i was using my own editor and that's why i had an issue)

2 Answers

Carlos Lantigua
Carlos Lantigua
5,938 Points
Carlos Lantigua
Carlos Lantigua
5,938 Points

At first I thought he was using backticks rather than regular quotes due to the color of his editor syntax. Maybe that is the issue you are having? Here is my code, it ran fine for me.. maybe you can spot the difference in yours.

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();