Hi,

I am trying to implement the loading please wait image funtionality while controls refersh on the page. Here are steps I have taken:

1. Added the image to the .net solution file in the image folder.
2. Added a div with the hidden class that holds the image source on the webform.

Image loads hidden by default and I am trying to show it when any postback or partial post back occurs. There are several controls like dropdowns, checboxes, gridview etc and links in the gridview that could take a few moments to load so I want to display the loading please wait while they reload after selections are made. All Controls exist in the update panel. I can't figure out how to show the image and hide it again when controls are reloaded. I am trying to add to this existing jQuery, my challenge is events occur after the document has been loaded so I need to add Ajax events to this query to show hide the loading please wait image. Here is what I have so far



//Dialog box settings

$(document).ready(function() {

    // $("mytest").dialog({
        title: "   Test",
        resizable: false,
        modal: true,
        height: 100,
        width: 100,
        autoOpen: false,
         buttons: {
            'OK': function() {
                $(this).dialog('close');
            },
            'Cancel': function() {
                $(this).dialog('close');
            }
        }
    });

    $(".myLink").live("click", function(e) {
          var id = $(this).html();
        var mytext = "my first Test";


        });
        $("#mydiv1']").dialog("option", "title", "Test");
        $("#mydiv2").html("Comments: " + mytext);
        $("#mydiv3").dialog("open");

    });

   
});

Here is the code I have tried but it does not kick off, I am not sure how to combine it with the code above:

$("#loading").ajaxStart(function(){
    $(this).show();
 }).ajaxStop(function(){
    $(this).hide();
 });

Thanks