Browser JQUERY data cache IE7

Question

Can anyone shed some light on the following phenomenon?

I have a ASP.NET MVC application running on target platform IE7

If I enter a record into the database then navigate to an ASPX page that contains HighChart graph the data entered is not represented. I have to close the browser and reload the application to get the data to show up in the charts.

I run the application in debug mode and the code does not hit the breakpoints in the controller. Its as if the client JQUERY code thinks there is no change and is caching. The controller does not even fire but the app runs like its working with the old data.

When I reload the application (stop and start) the controller fires and i can debug and the latest data comes in

Crazy stuff, there must be a setting perhaps for the web.config or somewhere to ensure that client JSON calls always goto the controller and not cache

Any comments much appreciated

J

CODE if needed below :

    function CreateChart1(surl) {

        // Code block for fetching Array as jsonResult (js)
        var url = $("#AbsolutePath").val() + "Incident.mvc/GetChartData_IncidentsBySiteStatus/" + surl;

        var chart;
        $.getJSON(url, null, function(data) {

            var result = [];
            jQuery.each(data, function(i, val) {
                result[i] = [val.Site, parseInt(val.Count)];
            });

            chart = new Highcharts.Chart({
                chart: {
                    renderTo: 'chart1',
                    plotBackgroundColor: null,
                    plotBorderWidth: null,
                    plotShadow: false
                },
                title: {
                    text: 'Number of Environmental Incidents by Site Status'
                },
                tooltip: {
                    formatter: function() {
                    return '<b>' + this.point.name + '</b>: ' + this.y + ' (' + Math.round(this.percentage) + '%)';
                    }
                },
                plotOptions: {
                    pie: {
                        allowPointSelect: true,
                        cursor: 'pointer',
                        dataLabels: {
                            enabled: true
                        },
                        showInLegend: false
                    }
                },
                exporting: {
                    enabled: true
                },
                series: [{
                    type: 'pie',
                    name: 'Incidents by Site Status',
                    data: result 

}]
                });
            });
        };

CONTROLLER CODE :

    public JsonResult GetChartData_IncidentsBySiteStatus(string SiteTypeId, string searchTextSite, string StartDate, string EndDate)
    {
        if (searchTextSite == null)
            searchTextSite = "";

        DateTime startDate = DateTime.Parse(StartDate);
        DateTime endDate = DateTime.Parse(EndDate);

        IQueryable<Site> sitesQry = _db.Sites;

        if (SiteTypeId != "-1")
            sitesQry = sitesQry.Where(a => a.SiteTypeId.ToString() == SiteTypeId);

        var qry = from i in _db.Incidents
                  join s in sitesQry on i.SiteId equals s.SiteId
                  where s.SiteDescription.Contains(searchTextSite)
                    && (i.Raised >= startDate && i.Raised <= endDate)
                  group s by s.SiteStatus.SiteStatusDescription + "[" + s.SiteTypeId.ToString().Replace("1","ON").Replace("0","OFF") + "]"
                      into grp
                      select new
                      {
                          Site = grp.Key,
                          Count = grp.Count()
                      };

        return Json(qry.ToList()  , JsonRequestBehavior.AllowGet);
    }

Answer 1

The default settings for AJAX calls in jQuery (except for script and jsonp) is to allow caching. You can use the ajax method to make the call so that you can specify that caching should be disabled:

$.ajax({
  cache: false,
  url: url,
  dataType: 'json',
  success: function(data) {
    ...
  }
});

Answer 2

The problem is that IE7 caches also the GET rewuest done through AJAX. I usually add a random number to the query string so that the request is not cached.

you could do:

 var noCache = new Date().getTime();
//then add nocache as a paremter to the url
var url = $("#AbsolutePath").val() + "Incident.mvc/GetChartData_IncidentsBySiteStatus/" + surl+"&nocache="+noCache;