Question

Please see the jQuery code below, it used to paginate some search results

paginate: function() {
        $("#wishlistPage .results").html("<div id='snakeSpinner'><img src='"+BASE_URL+"images/snake.gif' title='Loading' alt='...'/></div>");
        var url = BASE_URL+"wishlist/wishlist_paginated/";
        $.ajax({
            type: "GET",
            url: url,
            data: {
                sort_by:$('#componentSortOrder input:hidden').val(),
                offset:My.WishList.offset,
                per_page: 10,
                timestamp: new Date().getTime() 
            },
            success: function(transport){
                $("#wishlistPage .results").html(transport);
            }
        });
    },

My issue is not with the pagination, issue is when i need to call this same function when something happed to other part of the page which remove some search results, it brings the old results in IE7, other browsers works fine. So added the timestamp: new Date().getTime() part. That fixed the IE issue.

I want o know why this happens in jQuery? Do I need to include a timestamp parameter to URL to avoid caching in all jQuery Ajax calls?

Answer 1

In short, yes. IE doesn’t obey normally caching rules, but jQuery can add this parameter automatically for you as well, just use the cache: false option like this:

    $.ajax({
        type: "GET",
        url: url,
        cache: false,
        data: {
            sort_by:$('#componentSortOrder input:hidden').val(),
            offset:My.WishList.offset,
            per_page: 10,
            timestamp: new Date().getTime() 
        },
        success: function(transport){
            $("#wishlistPage .results").html(transport);
        }
    });

The result is the same, it adds a timestamp to the URL, you can see the code here.