Question

I have an ajax query that returns an array . . I only show the first 20 items in the array right now but i have now added a link for “Show All” after I displayed those first results.

When the user clicks Show All i want to display all of the items in the array.(either inline or in a dialog (but that implementation shouldn’t matter)

I want to avoid having to go back to the server to get the full list since I already retrieved the full list from the first ajax call . . where is the best way to locally store this array to be accessed later.

Answer 1

Save the array in a variable, or possibly attached as a data element to something on the DOM. Then, when your “Show All” event fires, read from that array and rebuild your display.

<div id="myArrayDisplay">
</div>

<script>
$(function () {
 $.getJSON("backendCode.php", function (jsonData) { // assumes your array arrives as a response from a JSON-based Ajax request to some server code
  $("#myArrayDisplay").data("arrayObj", jsonData);
 });

});
</script>

Obviously I’m not showing how you would display the contents of the array in the above code, just how I would store it.