Help with Quote Generator (please!)

JavaScript
1

Hi everyone,

I had this working but somehow I killed it. When I click the ‘new quote’ button nothing happens, however it will get a new quote via the API if I have Chrome Developer Tools open. I don’t know enough yet to know what I’m doing wrong.

Can anybody help? Otherwise I think it’s computer out window time :laughing:

Thanks!

Full Page View
Editor View

2

When I put in some debug console.logs, it looks to me like it is recalling your getNewQuote function each time, but the $.getJSON is returning the same quote each time. I think that your browser is caching the response so it says, “Hey, this is the same request I’ve already gotten, I can just give the same response I’ve already gotten.”

You could specfically tell it not to cache this, but I think you need the $.ajax to do that:

function getNewQuote() {	
	$.ajax({
		url: "https://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1",
		cache: false,
		success: function(json) {
			var quote = "";
			var author = "";
			var tweetLink = "";

			json.forEach(function(val) {
				quote = val.content.replace(/<\/?[^>]+(>|$)/g, "");
				author = "- " + val.title;
				tweetLink = "https://twitter.com/intent/tweet?text="+encodeURIComponent(quote)+author+"&hashtags=quote";
			});

			$("#quoteText").html(quote);
			$("#quoteAuthor").html(author);		
			$("#tweetme").attr("href", tweetLink);
		}
	})
}

The other option is to set it globally to not cache, by putting this:

$.ajaxSetup({ cache: false });

as the first line of your $(document).ready callback function.

3

Hey Kevin. I have literally not 10 seconds ago figured that out! Talk about timing!

Thanks so much for taking the time to help - I’ve been banging my head off the table for about an hour now. I was in Firefox & saw the same thing was returning each time…eventually got to considering the cache :blush: