Mistakes Were Made
Mistake 1: Parentheses!!!
Syntax is a funny thing. I spent 10 minutes watching my DOM be updated with the content I wanted and then watching that content almost immediately disappear. The content was there. If I added it in debugger, it stayed. Something happened in the milisecond immediately after the content was added to take it away. If you’ve been programming for any length of time, you’re probably screaming “Prevent Default!” In your head, and so was I. I’d prevented the default. Or so I thought. Actually, though, I’d only referenced the function.
I’m not proud to say it, but I worked around the problem by removing the href from the link. Success(ish). After a night’s sleep, I came back to it with fresh eyes, and discovered the issue.
Mistake 2: Riding on someone else’s Handlebars
Mistake 3: Make me a promise
My queries were chugging right along, loading up data, tossing it into the console to make sure it was there and then…gone. Not available to the functions in which I was referring to it. After some poking (and lots of
console.log() I realized that the problem was that the request was completing after the second function had fired. Which made sense, but I wasn’t sure how to fix it. I made it work by chaining functions in my callback, but generating the HTML and adding it to the DOM didn’t seem to belong in my query function.
I tossed this one to a developer friend of mine who said “You need to use a Promise”. I’d heard of this elusive promise. I even had a sense that I’d used one before. Was maybe even using one now…
Nope. A request callback is not a promise! Phew! Good to know (I’ll tell some actor friends). I returned my query on a function, added a
done(), and just like that, my concerns were seperated and my app was working.
Tim Gunn would be proud: I worked through my problems, I hit my deadline, I made it work and if there are a few places that I could have trimmed threads or added a zipper, that’s always going to be true.