Quote Machine Help Please!


I’m wondering if someone might have 5 minutes to point me in the right direction for fixing my random quote machine?

The first time that I’m using JSON, and I’m getting a bit muddled. I’m trying to use json.parse but something is going wrong.

My codepen is here - http://codepen.io/jameswinfield/pen/JXYyjB


Hey James, let me explain what’s going wrong:

(update: re-read your code, answer updated)

  • You try to use the value returned by $.getJSON, which is not what you think it is. It is not json, but a so called jsXHR-object. This thing offers additional functionality, like the ability to specify a function that gets called when your request fails etc. $.getJSON does not return json directly, because it takes some time to get it, If it would, your script had to wait until your request reached the server, the server collected the requested data and you got the results. You can’t know how long that will take, so it’s common in web development to provide a function that gets called back when the results are in.
    What you actually want to use is the first argument of the success function, which is called json in your case.
  • In your success handler for $.getJSON, you call $.parseJSON(jsonstuff). As already established, jsonstuff is not json. Even if you used json instead, it still wouldn’t work, json has already been parsed for you convenience. You can look it up in the jQuery documentation. So tl;dr: use json.author, json.quote.
  • This is almost correct: $('.quote').html(author);
    Assuming .quote should contain the quote, use json.quote. Also, use $('.quote').text(json.quote) instead of html(), as you only want to change the text, not the markup. In this case, it doesn’t really matter,
    but it’s good practice to be precise. You probably want to add another div/etc. for the author, where you can use the same code. Remove everything else.
1 Like

I think the correct way to complete this challenge is using Random Famous Quotes api.
I think the problem is ajax request.
I have trouble how to request.
I found sample code to execute this request in this link.


Source Code

Oh my, it’s miles simpler than I was attempting!!

I’ve forked it to here - and it’s working! http://codepen.io/jameswinfield/pen/VjwEZg


Aaaarrrrrgggh it’s now totally stopped working.