I have the following script which works fairly nicely to show when ajax stuff is loading:
$("#divLoading").ajaxStart(function () {
$('#divLoading').show();
});
$("#divLoading").ajaxComplete(function () {
$('#divLoading').hide();
});
However, this seems to start with a delay after a click event and ends before the content is displayed on the screen, i.e. the following is exagerated, just to explain the issue:
If I click on a button which executes something ajaxy, the loading div appears 5 seconds after clicking the button. The div stays on the screen for 10 seconds, the div disappears and the content change happens 5 seconds after the div has disappeared.
Any idea why this is happening and how I can get the message to display itself as soon as any click event happens, and only disappear when the html has finished loading on the screen?