sAjaxSource doesn't get executed in IE

Question

I am using jquery datatables serverside in my MVC application. When I put a break point to my controller method “FillTable” the execution only reaches on the first occasion on IE. If I go back and reload the page and the data is different the function doesn’t get called. When I try Firefox the break point is hit on each reload without any problem. Here is my code.

$(document).ready(function() {
    $('.details').dataTable({
        "bServerSide": true,
        "bProcessing": true,
        "sPaginationType": "full_numbers",
        "sAjaxSource": "../PrepareStatements/FillTable",
        "aoColumns": [
            { "sTitle": "#" },
            { "sTitle": "Date" },
            { "sTitle": "Remarks" },
            { "sTitle": "Dr/Cr" },
            { "sTitle": "Amount"}]
    });
});

My datatable is

<table width="100%" class="details"  id="eDataTable"></table>

But if I change the number of display lines, click on a pagination or perform a search it works. Could someone please help me on this.

Answer 1

Ok i found the solution. You must add a POST as IE tends to cache the data results using GET requests. I have added the following to my function and it works fine now.

$(document).ready(function() {
    $('.details').dataTable({
        "bServerSide": true,
        "bProcessing": true,
        "sPaginationType": "full_numbers",
        "sAjaxSource": "../PrepareStatements/FillTable",
        "fnServerData": function(sSource, aoData, fnCallback) {
            $.ajax({ "dataType": 'json',
                "type": "POST",
                "url": sSource,
                "data": aoData,
                "success": fnCallback
            });
        },
        "aoColumns": [
            { "sTitle": "#" },
            { "sTitle": "Date" },
            { "sTitle": "Remarks" },
            { "sTitle": "Dr/Cr" },
            { "sTitle": "Amount"}]
    });
});