jQuery tabs and IE8 caching

Tagged Under :

I have been using jQuery tabs in several places in one of my websites. And most of the tabs I have are setup as AJAX tabs. ie they are fetching data only when they are clicked on. This has been working fine in all other browsers except in IE8. IE8 doesnt show the latest content within a tab. If I go and delete a data row or add a data row, IE8 will keep on showing the old dataset. At first, I thought, this must be a case of telling IE8 not to cache anything. So, I added the following 2 meta tags in the page.

<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="-1">

I thought that should fix it, but it didn’t. I was still having the same issues. I then started looking into jQuery docs to see if some attribute I could use. Sure enough, there is a “cache:false” option you can pass in on your tabs. So, I did this next.

$("#tabs").tabs({
 cache:false
 ,spinner: ''
 });

Unfortunately, that didnt solve it as well. Then, my last option was to just add some random number to the URL so IE8 identifies it as a different URL and gets new data. So, I did this :-

<li><a href="url/rows?randomseed=<cfoutput>#randrange(1,10000)#</cfoutput>" id="favorites"><span>Favorites</span></a></li>

And that solved my issue. So, I guess jQuery cache:false is not doing something right here.

I just wanted to share my experience here and see if anyone has any different thoughts.

Comments:

3 Responses to “jQuery tabs and IE8 caching”


  1. Anuj,

    Try this…

    cache: false,
    ajaxOptions: {cache: false}

    I was having this issue, and shutting off the ajaxOptions cache seemed to fix is


  2. @Curt, that works mate! thanks for the tip.


  3. Also, for other AJAX requests, I typically add a variable to the query string named _r witha value of Math.random()

Leave a Reply