Home » CodeDigest


Display Loading/Progressing image for jQuery Ajax methods in Asp.Net
Submitted By Satheesh Babu B
On 2/10/2010 9:59:58 AM
Tags: Ajax,,CodeDigest,jQuery  

Display Loading or Progressing image for jQuery Ajax methods in Asp.Net - A jquery equivalent of UpdateProgress Control

ASP.Net AJAX includes UpdateProgress control to show progress message or image to inform the users that the ajax request is still in progress.
We can display such progress message or image using the ajax events present in jQuery library when making ajax request using jQuery in


The below code helps you to do that,


<script src="_scripts/jquery-1.3.2.min.js" type="text/javascript"></script>
<script language="javascript">
$(document).ready(function() {

$("#btGetDate").click(function() {

 type: "POST",
 url: "/AjaxSample/GetDate.asmx/GetDateTime",
 data: "{}",
 contentType: "application/json; charset=utf-8",
 dataType: "json",
 success: function(msg) {


$("#loadimg").ajaxStart(function() {

$("#loadimg").ajaxStop(function() {

    <form id="form1" runat="server">
    <img id="loadimg" style="display:none;" src="loading.gif" />
<div id="dvDate"></div><input id="btGetDate" type="button" value="Get Date" /></div>

The above code will display the progress image for all the ajax request made in the form.


Happy Coding!!

Do you have a working code that can be used by anyone? Submit it here. It may help someone in the community!!

Recent Codes
  • View All Codes..