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) AJAX Concepts Finish the AJAX Request

Dan Boswell
Dan Boswell
2,570 Points
Posted by Dan Boswell
Dan Boswell
2,570 Points

XHR request not passing the challenge?

I have no idea why this won't pass the challenge. It asked me to open the AJAX request with the GET method and point it to the footer.html.

app.js 
var request = new XMLHttpRequest();
request.onreadystatechange = function () {
  if (request.readyState === 4) {
    document.getElementById("footer").innerHTML = request.responseText;
  }
  request.open('GET', 'footer.html');
  request.send();
};
index.html 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>AJAX with JavaScript</title>
  <script src="app.js"></script>
</head>
<body>
  <div id="main">
    <h1>AJAX!</h1>
  </div>
  <div id="footer"></div>
</body>
</html>

1 Answer

Michael Hulet
Michael Hulet
47,912 Points
Michael Hulet
Michael Hulet
47,912 Points

You're really close. The 2 lines you wrote are great, but you put them in the wrong place. They need to go outside the brackets of the onreadystatechange function instead of inside, because otherwise they'll never get called and nothing will ever happen

Dan Boswell
Dan Boswell
2,570 Points
Dan Boswell
Dan Boswell
2,570 Points

Thank you! Sometimes it takes a fresh pair of eyes to show you where you're going wrong.