views:

2481

answers:

1

I want to have a timeout after 5 seconds and then display "Unable to fetch page". But im not sure how to go about it... Heres what I got so far...

$(document).ready(function() {
     $('#content').html('<br><br><br><br><img src="load.gif" border="0"><br><br><strong>Generating Link...</strong>');
                $("#content").load("ajax.php");
})
+3  A: 
var tick = function() {
             $("#content").html('Unable to fetch page!');
           }

$(document).ready(function() {

                var loadTimeout = setTimeout(tick, 5100);

                $.ajax({
                  url: "ajax.php",
                  timeout: 5000,
                  success: function(data) {
                    $("#content").html(data);
                    clearTimeout(loadTimeout);
                  }
                });

})
code_burgar
Hmm.. it just didnt load the page at all nor show the error
Imran
I simplified it a bit
code_burgar
@Imran sorry i had an error.. there was a "vat" instead of a "var" on line 1
code_burgar
Oh right nah i got it working now.. but i've noticed something... On ajax.php I simply made a sleep(6), so now what happens is once it hits the 5 second limit it shows that error message and then after a second loads the content on ajax.php. Once the error message has been displayed can I not stop it loading the page? that was kinda the point
Imran
@Code_burger: Yeah I just realized after reading your 1st comment
Imran
@Imran: Changed code to use $.ajax as $.load binds the callback function to completion of request regardless of outcome. It also supports a custom timeout. Should work ok now.
code_burgar
Thanks, thats exactly what I was looking for :-)
Imran
You are welcome
code_burgar