how to show a modal Loading ... while a ajax request $.get/$.post is running?

Question

I have a web application in asp.net, mvc and sometimes my ajax request might take more than 1 second.

So I need to show a big div over the entire page (Loading...) while this request is working and to hide it when it's finished.

Does anybody know how to do this ?

Answer 1

For jQuery AJAX, check out the API documentation: http://api.jquery.com/category/ajax/

For blocking the screen check out this plugin: http://malsup.com/jquery/block/#

The demo page for this site ( http://malsup.com/jquery/block/#demos ) will give you an idea of how to use it.

Answer 2

I'm using jQuery throbber plugin: http://www.jquery-plugins.info/throbber-aka-loading-animation-00015440.htm

It's pretty simple and easy to integrate. Can be running manually and can be attached for ajax events automatically.