Show downloadable message when loading content in asp using jquery ajax

Question

In my asp site, I'm trying to get user data from Active Directory when the page loads. I like to show the image "loading.gif" until I get the details. Can someone help me since I'm new to jquery

Answer 1

The simple form of AJAX is a method .get()that should be sufficient for your needs.

First of all, add a placeholder in your HTML where the loading image will appear, when you load the content, this content will be placed instead of the image.

For instance:

<div id="ContentsPlaceholder"></div>

jQuery :

$(function() {
    $("#ContentsPlaceholder").html("<img src='Loading.gif' />");
    $.get("GetData.asp", function(contents) {
        $("#ContentsPlaceholder").html(contents);
    });
});

"Loading.gif" , "GetData.asp", , .

Answer 2

:

$(function(){
    $('body').addClass('loading');
    $(window).load(function(){
      $('body').removeClass('loading');
      $('#wrapper').show(); // make display:none in the css.
    });
});

ajax, .ajaxStart() .ajaxComplete()

ajax:

$('#yourElem').ajaxStart(function() {
   $(this).addClass('loading');
});

ajax Call:

$('#yourElem').ajaxComplete(function() {
   $(this).removeClass('loading');
});