Firefox 12 not updating using jquery post

Question

I have read many posts(problems) with IE and jquery posts, but never thought I'd be asking how to make it work in Firefox, as it works great in IE9(with headers for no cache) and Chrome.

$(document).ready(function(){
    setInterval(function(){
        $.post("dashBoardsql.php", {track : 2}, function(pendingReq){
            $("#myTable").html(pendingReq);
            }),
            "html" });
}, 27000);

Is my jquery code, like I said, it works fine in IE9 and Chrome, but I have to refresh the page in FF12 to see an update passed back by pendingReq. I've used Firebug to watch the console with the POST data, and it just sits until I F5 the page. Also, no errors are reported and my header for no-cache, must revalidate is in place:

header("Cache-Control: no-cache, must-revalidate"); // HTTP/1.1
header("Expires: Sat, 26 Jul 1997 05:00:00 GMT"); // Date in the past

Any suggestions? Also of note, testing is being done with WAMP on my local machine, so no cross-domain issues

SOLVED! The issue 'was' a syntax error, but not in the way suggested, @KevinB example on fiddle showed me, from the original code above, it now looks like:

$(document).ready(function(){
    setInterval(function(){
        $.post("dashBoardsql.php?_=" + $.now(), {track : 2}, function(pendingReq){
            $("#myTable").html(pendingReq);
            }),
            "html"
}, 27000);
});

Plus all the header info, but I see all the new timestamps appear and updates happen. Thank you all!

Can you provide a link to an example ? This could be very useful :). — fflorent, May 07 '12 at 17:17
A link? data is being returned only if I F5, and is being done on my local machine. The above code works great on Chrome and IE9 as stated, but I have to manually refresh to see new sql data — Chad W, May 07 '12 at 17:21
What he means is: So that we can help, can you provide a link to the live site where this is happening or can you recreate the issue using http://jsfiddle.net? — tw16, May 07 '12 at 17:31
No live site(local machine) and I don't see a mySQL resource to add to set the two pages up — Chad W, May 07 '12 at 17:44
Here's your code replicated on jsfiddle: http://jsfiddle.net/xxMBq/ — Kevin B, May 07 '12 at 17:50

score 1 · Accepted Answer · answered May 07 '12 at 17:34

1

Try adding an anti-caching string to the url.

$.post("dashBoardsql.php?_=" + $.now(), ...)

answered May 07 '12 at 17:34

Kevin B

92,700
15
158
170

I will try, but does FF cache pages too? I've added that to defeat IE, with no luck and added the cache: false to the ajaxSetup, no luck, but the headers seem to have fixed it all. I will try, thank you – Chad W May 07 '12 at 17:48
string buster, nothing... still have to F5 – Chad W May 07 '12 at 17:55
Here's a similar question, take note of the last answer where it shows what headers the server should return to prevent caching: http://stackoverflow.com/questions/367786/prevent-caching-of-ajax-call – Kevin B May 07 '12 at 18:01
worked fine on fiddle(thank you for showing me that!) and as for caching server side, I enabled headers-mod on apache and I'm still figuring out the cache-mod, but isn't using POST supposed to negate caching by default? – Chad W May 07 '12 at 18:35

score 0 · Answer 2 · answered May 07 '12 at 17:35

0

I do not know if your code is the one you have in your website, but it includes syntax errors.

But the most intesresting thing is that in the intervaled function, $ is not recognized any more. And I do not understand why =/...

So use this instead :

$(document).ready(function(){
    setInterval(function(){
        jQuery.post("dashBoardsql.php", {track : 2}, function(pendingReq){
            jQuery("#myTable").html(pendingReq);
        },"html");
    }, 27000);
});

Moreover, even in normal case, it is recommended to use the jQuery variable rather than $ (because of possible futur conflict with other framework, etc.).

Edit : I do not know if this answers to your problem, though...

answered May 07 '12 at 17:35

fflorent

1,403
9
8

I'm not sure who recommends to use `jQuery` over `$`, I would instead recommend not using any other library alongside jQuery due to the increased number of http requests that involves. As far as the `setInterval` issue you mentioned, that simply isn't true (or I can't recreate it). http://jsfiddle.net/HRvZp/ – Kevin B May 07 '12 at 17:45
jQuery.post does not help or fault, same issue – Chad W May 07 '12 at 17:52
@KevinB the problem occurs with (my) Firefox 12 – fflorent May 07 '12 at 18:02
@ChadW did you correct the syntax errors? I do not know otherwise =/ – fflorent May 07 '12 at 18:04
On my machine, and could be because of my set up, I have no syntax errors, not in IE or Chrome(firebug) and the above runs great, I always remember IE being the problem! ?? – Chad W May 07 '12 at 18:07
@fflorent Does it also happen here? http://jsfiddle.net/HRvZp/1/ (console on right should have `1` logged 6 times). It doesn't happen on my FF12, defaults no extensions. – Kevin B May 07 '12 at 18:07
@KevinB No problem with your example. I tested also that code : http://jsfiddle.net/6WNM9/, and no problem too. But I discovered that the Firefox's console (that you get when hitting CTRL+MAJ+K) shows undefined. So I tested with Firebug and no problem. Seems the Firefox's console has some odd behaviour... – fflorent May 07 '12 at 18:24

score 0 · Answer 3 · answered May 08 '12 at 07:29

0

$(document).ready(function(){
    setInterval(function(){
        $.post("dashBoardsql.php?_=" + $.now(), {track : 2}, function(pendingReq){
            $("#myTable").html(pendingReq);
            }),
            "html"
}, 27000);
});

answered May 08 '12 at 07:29

Alfred

19,306
58
155
232

Firefox 12 not updating using jquery post

3 Answers3