Cache .ajax response data to prevent duplicate API calls on user back arrow
I am using .ajax() to make a request to an API and return results. When a user clicks the back arrow/back button in their browser to come back to my page, I want to load the API results from the cache instead of making a new API call. How do I do this? Is my code already doing it? I am using GET requests with cache: true.
<input required class="searchBox" id="searchBox" type="text" name="q" value="example"> <script> function loadSearches(){ var searchData = { query: $("#searchBox").val(), }; var searchOptions = { url: "https://example.com/load_search.php", dataType: "text", type: "GET", cache: true, data: { searchData: JSON.stringify( searchData ) }, success: function( data, status, xhr ) { $(".resultsSection").prepend(data); } }; $.ajax( searchOptions ); } $(document).ready(function() { // call functions after page loads loadSearches(); }); </script> 
