Jquery Ajax requests not working on IE 10 (due to cache)

Question

I would like to begin with this. I am fed up with IE. I have the code below:

$(function () {
$("#cal").on('click', "#forward", function () {
    $.ajax({
        url: "Home/Calendar?target=forward",
        type: "GET",
        success: function (result) {
            $("#cal").html(result);
        }
    });
  });
});

 $(function () {
$("#cal").on('click', "#backwards", function () {

    $.ajax({
        url: "Home/Calendar?target=backwards",
        type: "GET",
        success: function (result) {
            $("#cal").html(result);
        }
    });
});
});

It is an ajax call to a controller action in an C# MVC application. It just goes back and forth a calendar's months replacing the html. Now I know that you need to reattach the event due to the html() call and that is why I use on() with JQuery 1.7. I have used delegate() as well. In FF, Chrome it works as intended. In IE 10 it does not. I am at a loss. I knew that IE had issues with delegate in IE8 and with JQuery < 1.5 but this is not the case.

Does anyone know how to solve this?

Answer 1

I am answering the question just for future reference for other people. It seems that IE is caching AJAX requests for some reason I am unable to comprehend.

I noticed using the (surprisingly good) developer tools IE 10 provides that I was getting a 304 not modified response to my AJAX requests. This was not the case in Firefox or Chrome (200 was the response).

I added the cache: false option to my AXAJ JQuery functions and now it works as intended.

IE never seizes to amaze me.