Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

JavaScript AJAX Basics (retiring) Programming AJAX Stage 2 Challenge

balraj sarai
balraj sarai
6,303 Points

programming AJAX

Can you please check what the problem is with this code. I tried to do the rooms widget on my own. I do not get any errors, but the list comes undefined and in my employees list, instead of in the rooms list.

var xhr1 = new XMLHttpRequest();
xhr1.onreadystatechange = function () {
  if(xhr1.readyState === 4 && xhr1.status === 200) {
    var rooms = JSON.parse(xhr1.responseText);
    var statusHTML1 = '<ul class="bulleted">';
    for (var i=0; i<rooms.length; i += 1) {
      if (rooms[i].available === true) {
        statusHTML1 += '<li class="yes">';
      } else {
        statusHTML1 += '<li class="no">';
      }
      statusHTML1 += rooms[i].room;
      statusHTML1 += '</li>';
    }
    statusHTML += '</ul>';
    document.getElementById('roomList').innerHTML = statusHTML;
  }
};
xhr.open('GET', '../data/rooms.json');
xhr.send();

hi , i sugest you to add

var  your code here 

``javascript# and then close without hte phone sign adding three of that at the end of your code on next line

it will make easier and faster for peopel that will help you

Two possible problems:

1) Class name for the unordered list has changed. It should now be:

'<ul class="rooms">'

2) Using the right class name for the list items. I think you need to change your if/else statement so that if true,

        statusHTML += '<li class="empty">';

And then if false the class name would be full.

Hope that helps!

1 Answer

balraj sarai
balraj sarai
6,303 Points

var statusHTML1 = '<ul class="rooms">';

i forgot to change the class name of this (above), and also forgot to change the variable names (below) to xhr1.

xhr1.open('GET', '../data/rooms.json');
xhr1.send();

but thank you all for your replies.