I am trying to complete the random quote generator with vanilla js but i’m really stuck.
Am i returning the data in the correct format, as far as i know i am returning a json object, (i’m using a gist from my own git page: https://gist.githubusercontent.com/char502/abbd19ab22972fa732a33f1bfda04ad8/raw/a4582b8aa8b634a99d773bd66232cca1702952f3/Quotes,json is that ok, will it work?) is it coming back in the correct format or do i have to change it to something else before i can work with it - for random quote generating purposes - (it looks ok when i console.log(obj)? -
i.e. what form should it be in and how can i refer to it in the code further down (i.e. the random variable and the click event)
Is a click event listener the correct way to go to get a working button for this?
How do i make the button return random quotes, at the moment i can only get it to return the last quote in the list
Sorry if these seem stupid questions, i’m really new at this and trying to improve my vanilla js
You’ve already got the quotes in an array. Just move the code you have to randomly select one into your event handler and you’ll be able to get a new quote each time the button is clicked.
It is, but presumably you’ll want the event to be bound to the button instead of the whole document. As already mentioned, make sure the function picks a new quote each time it’s run or it won’t look like it’s doing anything at all.
You’re very close. To start, you don’t need the forEach call after you get the data. data is an array of quotes, and you only need one at a time. Keep that variable where it is and move all your other code out of the forEach method. Change your randomization code to select from your data instead of just one quote.
var random = <<change me>>[Math.floor(Math.random() * quote.length)];
I think i sort of almost have it, i just can’t seem to make my quote button work, Can anyone help, i feel like i’m really close but just can’t get this final piece in place and it’s driving me crazy?
OMG - it’s working - I just had a quick re-read of your tips PortableStick, realised i’d missed something and now it’s working thanks again for your help
yes, you’re probably right, I was experimenting with different styles before settling on the final design so there’s likely to be some redundant CSS in there - thanks for taking a look