JQuery Ajax call often not working on Safari 6

Question

My Ajax call is really simple as below:

function ajax(reqUrl, params , callback) {
console.log("Request URL "+reqUrl);
var cond;
cond = $.ajax({
    type: 'post',
    url: reqUrl,
    data: params,
    error:function(){ alert("some error occurred") },
    success: callback
});
console.log("Server response "+cond.readyState);
}
   // Call it as 
    var url = "/getResult";
    var params = {};
    params.param1 = "test1";
    params.param2 = "test2";
    ajax(url, params, function(returnCallback) {
        console.log(returnCallback);
        alert("Success");
    });

That works fine in most cases. But sometimes (about 1 times in 3) it doesn't return anything to callback.

I found many questions and answers for Not working ajax in Safari but fine in chrome and FireFox. My problem is different from them, because it's fine most of the time (I don't mean it was not fine usually because when I refresh my browser, that may cause my ajax call to work).

My main question is why does my ajax call sometimes fail? I don't get any errors on my JS console. When this situation, I refresh my browser to get my ajax call to. Any Ideas?

Update:

I found that sometimes my ajax call method didn't call out because console.log("Request URL "+reqUrl); did not execute. When I don't want to refresh my browser, I clicked many times on my page's link to produce result. will something late to execute?

Solution 1

Finally, I found error .. Safari doesn't reload my JavaScript files again even disable Cache. So I put all of my JS code into:

$(document).ready(function(){
 // start load my js functions
 init();
});

to reload my JS files when my page was ready. Cheer !

Solution 2

I also met this problem.

When I moved all code into $(function() {}), it worked.

After that, I found I had defined a variable named key, which caused the problem.

Just rename it, all things will be running.

Solution 3

This seems to be a Safari issue. In this post there is a suggestion to add a beforeSend to your ajax-request.

In your case:

cond = $.ajax({
    type: 'post',
    url: reqUrl,
    data: params,
    beforeSend: function (event, files, index, xhr, handler, callBack) {
         $.ajax({
             async: false,
             url: 'closeconnection.php' // add path
         });
    },
    error:function(){ alert("some error occurred") },
    success: callback
});

Comments

[Cataclysm]

When I add contentType: "application/json; charset=utf-8", that produce in my code as Failed to load resource: the server responded with a status of 400 (Bad Request).

[Cataclysm]

url:'@Url.Action("getResult","Controller")', what is it's definition and how to pass my url in it.