JQuery ajaxStart event not being captured in ASP.net AJAX

Question

I have an asp.net page with a save button within an updatepanel and contenttemplate. The save works nicely, but I am trying to add a "wait" gif while the save is happening using JQuery, but the ajaxStart event is not firing. I put a simple catch shown below:

        $(document).ajaxStart(function(){
            alert('starting');
        }).ajaxStop(function() {
            alert('done');
        });

No alerts show when I click the save. Is there a problem when trying to capture ASP.net Ajax events, is asp doing some funky type of Ajax calls that can't be captured by Jquery?

Thanks, let me know if you have any ideas about this,

Mark.

Answer 1

The ASP.NET update panels seem to do their own thing... Tap into the PageReuqestManager and setup your own calls here...

EDIT
I simplified the functions a bit below to match your sample a little more...

    <script type="text/javascript">
        function pageLoad() {
            if (!Sys.WebForms.PageRequestManager.getInstance().get_isInAsyncPostBack()) {
                Sys.WebForms.PageRequestManager.getInstance().add_endRequest(AjaxEnd);
                Sys.WebForms.PageRequestManager.getInstance().add_initializeRequest(AjaxBegin);
            }
        }

        function AjaxEnd(sender, args) {
           alert("I am done...");
        }

        function AjaxBegin(sender, args) {
            alert("I am about to start...");
        }
   </script>