API Quote Machine doesn't show random quotes

In my Random Quote Machine ( http://codepen.io/raulfm/pen/qroXEG ), when I click at the button, it shows a quote from a WordPress API ( http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&callback= ). But it show always the same quote! Why? It must show always a random quote, but it doesn’t work (because it always shows the same quote).

See how is the code below:

  $(".new-quote").click(function(){  
    $.getJSON("http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&callback=", function(json) {
      $("h3").html(json[0].content);
      $(".author").html(json[0].title);
    });
}

To understand what’s going on I suggest you open Devtools by hitting F12 and inspect the Network and/or Console tabs:
Here’s what I got:

As you can see you’re sending a GET request to /wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1
Since you left out the domain name, your browser thinks you want to GET http://codepen.io/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1 but there’s no such page so you get a 404.

In your message above you mention the full URL: http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&callback=

That’s what you have to use.

1 Like

Thanks! It worked fine!