Jquery block UI when ajax starts

Question

I am trying to show blockui when ajax starts like so:

 // block when ajax activity starts
    $(document).ajaxStart($.blockUI({ message: '<h1><img src="busy.gif" /> Just a moment...</h1>' }));

and then I want to stop it doing

 // unblock when ajax activity stops 
    $(document).ajaxStop($.unblockUI); 

Problem Is that it won't load when ajax is performed what have I done wrong'??

Answer 1

I think you need to change it like so:

$(document).ajaxStart(function () {
  $.blockUI({ message: '<h1><img src="busy.gif" /> Just a moment...</h1>' });
});

When you need to pass parameters to the function you want to bind you should use an anonymous function and then call your method inside it. $.blockUI() returns something which is not callable, so it doesn't work to bind it that way.