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 Programming AJAX Check for the correct ready state

Clint Travis
Clint Travis
2,264 Points
Posted by Clint Travis
Clint Travis
2,264 Points

Can't get passed this error: "Bummer: To select the <div> tag with the 'sidebar' ID, you need to pass the ID name as"

Can't get passed this error. I'm using the correct method and it looks correct.

app.js 
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() { 
  if (xhr.readyState === 4) {
    const status = xhr.status;
    if (status === 0 || (status >= 200 && status < 400)) {
      // The request has been completed successfully
      console.log(xhr.responseText);
    }}

};
xhr.open('GET', 'sidebar.html');
xhr.send();
var s = document.getElementById('sidebar');
s = xhr.responseText;
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="sidebar"></div>
</body>
</html>

1 Answer

Travis Alstrand
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Travis Alstrand
Treehouse Project Reviewer
Travis Alstrand
.a{fill-rule:evenodd;}techdegree seal-36
Travis Alstrand
Treehouse Project Reviewer

So what I did to get passed with with your code was move your var s line up and inside of the method above. It may just be the order in which it's checking for these lines of code on the backend, I'm not sure, you did in fact write that line correct, it was just the placement of it throwing the challenge off.

The error messaging here was not exactly helpful, sorry about that.

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() { 
  if (xhr.readyState === 4) {
    const status = xhr.status;
    if (status === 0 || (status >= 200 && status < 400)) {
      // The request has been completed successfully
      console.log(xhr.responseText);
    }}
    var s = document.getElementById('sidebar');    // MOVED LINE HERE
};
xhr.open('GET', 'sidebar.html');
xhr.send();