How to display a loading image until a gridview is fully loaded without Ajax Toolkit?

Question

QUESTION

Can anyone suggest how a loading image can be displayed until a gridview is fully loaded?

This gridview is to be rendered on page

Answer 1

Use beforeSend in conjunction with success and error like so:

$(function() {
  $.ajax({
    type: "POST",
    url: "Default.aspx/UpdateGV",
    data: "{}",
    contentType: "application/json",
    dataType: "json",
    beforeSend: function() {
        $("#loader").show();
    },
    success: function() {
        $("#loader").hide();
        // Run return method.
    },
    // it's good to have an error fallback
    error: function(jqhxr, stat, err) {
       $("#loader").hide();
       $("#error").show();
    }
  });
});

(provided you have and )

complete fires after success and error so using both success and error instead of complete and error assures no overlap.

Hope this was what you were looking for!