1

To clarify the above question title, what I am trying to do is create a grid of posts, for which I am displaying a thumbnail of an image that is attached to that post.

Then, upon clicking each of these images in the grid, I want to display the rest of the contents of the post (containing custom field data) via JS underneath the grid item.

All my frontend code is working. However, what I would like to do is set up the backend to query the posts once (initially when creating the grid) then when displaying the preview of each post, pull the remaining fields I need from each post into my preview HTML and display.

So in the backend, what I want to do is:

  1. When page loads, query DB for posts and store in PHP somewhere. In an array or object.
  2. Use certain fields to build grid of post thumbnails.
  3. Upon clicking the thumbnail, make an AJAX call (passing post ID) and return the fields from the array for object for that post ID via JSON.
  4. Load into preview HTML and display.

So, with that scenario in mind. How do I store the results of my query (in a function) then access that data later via AJAX?

Thanks in advance, Craig

  • 1
    WordPress provides both an object cache (non-persistent) and a tranisent API (persistent within the database) that you could use to store the query for later. Other persistent solutions required more advanced configuration. How many posts are you pulling into the page? How much data? You could return all the results and store them on the DOM node using jQuery.data(). For persisting results in the database you can store the result in a transient, then you would query the transient for the data you need. It would still require that you hit the database but it is computationally less expensive. – Adam Feb 13 '16 at 11:26
  • Hi userabuser, thanks for your comment. I'd say I'm storing quite a lot of data. 4 or 5 image urls, title, excerpt, content etc. So I don't want to store this in jQuery.data(). Had a quick read on the object cache API, looks like what I'm after. Thank you! – BarberCraig Feb 13 '16 at 12:04
  • 1
    Just remember that the default object cache implementation provided by WordPress only persists over the life of the request, so if you hit the database, cache the result and request terminates execution, you cannot access the result stored in cache. So you may want to also look at the Transient API as I mentioned, cybmeta provides an example below... – Adam Feb 13 '16 at 12:15
  • @userabuser it seem that you and me are saying the same thing. – cybmeta Feb 13 '16 at 12:45
  • Hey guys, I read deeper. You're right. I'm on the same page now :) – BarberCraig Feb 13 '16 at 12:54
1

Page load is a request, the software run, gives a response and close execution. Later Ajax is another request, totally separated. I you want objects to be persistently avaible between requests, you only have two options: use transients API or use object cache API combined with a cache plugin (object cache api is not persistent by default).

A very basic example of transients API:

if( false === ( $my_object = get_transient('transient_object_name') ) ) {

    // Build your $my_object here
    // For example
    $args= array();
    $query = new WP_Query( $args );

    $my_object = $query->get_results();

    // Store $my_object in a transient
    set_transient('transient_object_name', $my_object );
 }

Then, later, you can use get_transient('transient_object_name') to get the previously stored transient.

Transient API stores the object in the database (options table) to make possible to get it in subsequent requests without a new database call (well, one database call to get the transient but not the full operation to build the object).

Object Cache API is very similar but is not persistent by default. Its stores cached objects in memory instead of database and the object is cached only for current request. To make it persistent between separated requests, you need to use some persistent cache plugin, like W3TC.

If a persistent cache plugin is available, transient API stop storing the transient in database and works exactly like object cache API, storing in memory but data stored in memory is now persistent in both cases.

  • cybmeta, great answer, thank you. Had a brief read on both the APIs you referred to. Object Cache looks like the way to go. I don't need persistent caching for this task, I just want my post data loaded on the page to be accessible again when interacting with my grid by JS (then AJAX call). I don't to write all my HTML for my post reviews until required. So just to clarify, the object cache will allow me to store my original query in cache, and will be in the cache until navigated away from the page? – BarberCraig Feb 13 '16 at 12:08
  • You are wrong. You need persistent cache because you want to use the same data across two different requests: what you call page load is one requests and the ajax request is a different and separated request. That is what I explain at the begining of the answer. It seems that you don't understand that, and you believe that an ajax request within a page is the same request that the page itself, but not. – cybmeta Feb 13 '16 at 12:13
  • @BarberCraig yeah, cybmeta is right on this. I also mentioned it above in my comments... object cache is not going to help you because once you make the request, store your result in the object cache and the page finishes loading, your object cache value is gone. Any AJAX request you make back to the server after your initial request is an additional request, e.g. request #2. The only way to access the result again is to set and get a transient value. – Adam Feb 13 '16 at 12:54
  • Hey, userabuser. Replied above. Read further, and yes you guys are right. Sorry I misunderstood, got it now! (thmbs up) – BarberCraig Feb 13 '16 at 13:02
  • Transients or Object Cache + Persistent cache plugin are valids. @BarberCraig, if this answers your question, please mark it as the accepted answer, so other users can identify it easier. – cybmeta Feb 13 '16 at 13:29

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.