Displaying Progress Bar For Long Running Processes using ASP.NET AJAX

See more:

.NET

Ajax

jQuery

My client told me to display a progressbar for long running process. I did it with jquery and css and successfully got progress bar. But they not happy with progress bar and asked me to use ajax to create progress bar. so I searched lot in net but no use.. plz help me

CSS

.progress_bar
                {
                    background-image: url("inc/img/progcob.jpg");
                    height:20px;     
                    width: 150px;                  
                }
                
                .progress
                {
                    margin-top: 10px;
                    width     : 150px;
                    border    :solid 1px black;
                    
                }
    
                #Progressbarval
                {
                    font-family: Arial;
                    font-size: 14px;
                    font-weight: 900;
                    font-style: italic;
                    display: none;
                }

JQUERY

function SetProgress() 
                {
    
                    var statuscount = $("*[id$=hdnchkstatus]").val();
                    var statustotal = $("*[id$=hdnchktotal]").val();
                    progress = 0,
                        progress = statuscount / statustotal * 100;
                    $('.progress_bar').css('width', progress + '%');
                    if (progress != 100) {
                        $('#Progressbarval').html((Math.round(progress)) + '%');
                    }
                    else {
                        $('#Progressbarval').html((Math.round(progress)) + '% ! Completed').css("color", "green");
                    }
                    $('.progress').hover(
                    function () {
                        $('#Progressbarval').show("slow");
                    },
                    function () {
                        $('#Progressbarval').hide("slow");
                    }
                    );
    
                }

.aspx

<div class="progress">
   <div class="progress_bar"></div>  `div to display progress bar
   </div>

   <label id="Progressbarval">  `to display progress %`
   </label>