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

Leah Miller
Leah Miller
16,291 Points

Trying to convert widget project from xmh to fetch. I am struggling in general, code returning an error

I am getting this error:

widget1.js:46 Uncaught TypeError: Cannot set property 'innerHTML' of null at employeeStatus (widget1.js:46) at widget1.js:19

https://w.trhou.se/8nfrvignag

widget.js is the original, widget1.js is the one I am working on.

Please help. An explanation as to why would be super helpful. Struggling with fetch api

3 Answers

Steven Parker
Steven Parker
231,007 Points

This particular issue is not related to "fetch". The script is being loaded in the wrong place in the HTML file.

Scripts should be the very last thing in the "body" section of the HTML file to insure that any DOM elements referenced have already been loaded.


Part 2:

The code on lines 14-20 is creating two promises, combining them in a Promise.all, and then passing each of them as arguments to the helper functions. But the helper functions are expecting data arrays instead of promises.

You can fix and also simplify all that with just two promises with "then"s:

fetchData('../data/rooms.json').then(roomStatus);
fetchData('../data/employees.json').then(employeeStatus);
Leah Miller
Leah Miller
16,291 Points

Thanks! I made that change. Unfortunately it still isn't showing up with the 2 lists and its not giving me an error so I am not sure where I am wrong. I also moved the statusHTML and roomsHTML variables into their respective functions. Updated code linked.

https://w.trhou.se/8nfrvignag

Steven Parker
Steven Parker
231,007 Points

That's the same link as before. You'll need to make a fresh snapshot to get a link that will reflect your changes.

Leah Miller
Leah Miller
16,291 Points

https://w.trhou.se/mhu14oi0un Updated link. Thought I had taken a new one.

Steven Parker
Steven Parker
231,007 Points

Leah Miller — Glad to help. You can mark a question solved by choosing a "best answer".
And happy coding!