当前位置: 动力学知识库 > 问答 > 编程问答 >

jquery - How to show a message "Sorry it is taking time to load" on ajax if call take longer time

问题描述:

Say suppose there is my ajax call which call my PHP function to get some result.

$('.ui-loader').show();

$.ajax({

url: BASE_URL +'some_page.php',

type: 'POST',

datatype: 'json',

async:false,

success: function (response) {

// response will get my result from "somepage.php"

$('.ui-loader').hide();

},

error: function (jqXHR, textStatus, errorThrown) {

//alert(jqXHR.status);

}

});

How can I show a another loader which is stating that "Sorry it is taking time please wait" when ajax response taking time to get the result?

I come across ajaxStart() and ajaxStop() but how can I use here? Can you guys please guide me to achieve this thing.

Note : $('.ui-loader').show(); is a simple loader I want to hide this loader and show another which is stating "Sorry it is taking time please wait".

Thanks in advance.

网友答案:

You could do that using setTimeout like:

var longWaitTimerId = setTimeout(function () {
    //took longer than 5 seconds
}, 5000);

$.ajax({
    ...
    success: function (response) {
        clearTimeout(longWaitTimerId);
        ...
    },
    error: ... same as above
});
网友答案:
function MakeAjaxCall(){
//timer to show another loader
var timer = window.setTimeout(function(){
        $('.ui-loader').hide();
        $('.ui-AnotherLoader').show();
    }, 2000);
$('.ui-loader').show();
$.ajax({
    url: BASE_URL +'some_page.php',
    type: 'POST',
    datatype: 'json',
    async:false,
    success: function (response) {
          //clear the timer if ajax call take less time
          wiundow.clreatTimeout(timer);
         // response will get my result from "somepage.php"
         $('.ui-loader').hide();
         $('.ui-AnotherLoader').hide();
    },
    error: function (jqXHR, textStatus, errorThrown) {
        //alert(jqXHR.status);
    }
});
}
分享给朋友:
您可能感兴趣的文章:
随机阅读: