Question

i have very simple code that i making partial postback by jquery and i use ajaxStart/ajaxStop for doing some work. but it is not working. i just could not understand why it is not working.
here is my code

$("#imgHolder").ajaxStart(function () {
 $('div#content').block({
          message: '<table><tr><td><img  src="../images/ajax-loader.gif" border="0"/></td><td><h3>Processing...</h3></td></tr><table>',
        css: { border: '1px solid #a00' }
        });
    $('#imgHolder').empty();
    $("#btnPrint").hide();
    });

  $("#imgHolder").ajaxStop(function () {
  $("#btnPrint").show();
  $('div#content').unblock();
 });  



$(document).ready(function () {
 $.ajax({
  type: "POST",
  url: "UPSLabelFormUK.aspx/ProcessInfo",
  data: JSON.stringify(DTO),
  contentType: "application/json; charset=utf-8",
  dataType: "json",
  success: function (data) {
  if (data.d[0].Message == "SUCCESS") {
  //alert(data.d[0].TrackNumber);
  ///alert(data.d[0].LabelImagePath);
  var _images = [data.d[0].LabelImagePath];
  $.each(_images, function (e) {
    $(new Image()).load(function () {
    $('#imgHolder').html("<img src='" + data.d[0].LabelImagePath + "' width='310' height='402' border=0/>");
  }).attr('src', this);
 });
}
 } ,
  error: function (XMLHttpRequest, textStatus, errorThrown) {
  alert(textStatus);
  }
 });
 });

i just dont not understand why my above ajaxstart/ajaxstop did not work. please help me to understand why was wrong in my code.

but my ajaxstart/ajaxstop started working when i change the code a bit like

        $(document).ajaxStart(function () {
            $('div#content').block({
                message: '<table><tr><td><img  src="../images/ajax-loader.gif" border="0"/></td><td><h3>Processing...</h3></td></tr><table>',
                css: { border: '1px solid #a00' }
            });

            $('#imgHolder').empty();
            $("#btnPrint").hide();
        });


        $(document).ajaxStop(function () {
            $("#btnPrint").show();
            $('div#content').unblock();
        });

the only change is $(document).ajaxStop(function () { instaed of

$("#imgHolder").ajaxStart(function () {

so please explain why my above ajaxStart/ajaxStop code did not work. thanks

Answer 1

Given the fact that ajaxStart is only called if there are no other
ajax requests in progress, it makes is useless if you want to use it
as an AJAX loader indicator.

have u tried with ( tell me is it working or not)

jQuery(document).ajaxStart(function(){
alert("it begins");
})