Progress bar in asp.net

Question

Hi all,

I want to show progress bar in asp.net page I have to read column 'BuildCompletedCount' from database from table 'TestResultAvailibiltyMaster'.
Basically BuildCompletedCount keeps getting updated upto 9. As and when count is getting updated the 'progress bar' should show the progress. Like when it reaches 9, it should as 100% with colour of the progress bar getting turned into green and in the beginning it should be yellow.

I am using asp.net with MVC and Sql server as database.

Kindly waiting for your response.

Thanks,
Santosh

Answer 1

Hi @Santosh Umarani ,
As far as I think,you could use bootstrap or jquery to implement the progress bar.This is like:

$(document).ready(function() {         
        var count = 0;    
        var html = '';    
        $(".progress-bar").attr("aria-valuenow", "0"); //setting initial value of progressbar as ‘0’   
        $.ajax({   
         type: "POST",  
         url: "../ Progress/GetText",  
         contentType: "application/json; charset=utf-8",    
         dataType: "json",    
         async: false,   
         success: function(result) {  
            $.each(result, function(key, item) {    
            $('.table').hide();    
            html += '<tr>';    
            html += '<td>' + item.Name + '</td>';    
            html += '<td>' + item.Father’ sName + '</td>';    
            html += '<td>' + item.Gender + '</td>';    
            html += '<td>' + item.Address + '</td>';    
            html += '<td>' + item.Phone + '</td>';    
            html += '<td>' + item.Mobileno + '</td>';    
            html += '</tr>';    
            var myVar = setTimeout(updateProgress, 1, ++count, result.length, html);    
            html = "";    
        });    
        $('.table').show();    
    },    
    error: function(errormessage) {    
        $("#h3").text(errormessage.responseText);    
        return false;    
    }    
});    

More details,you could refer to below article:
https://www.c-sharpcorner.com/article/progress-bar-in-asp-net-mvc/
Best regards,
Yijing Sun

---

If the answer is helpful, please click "Accept Answer" and upvote it.

Note: Please follow the steps in our  documentation  to enable e-mail notifications if you want to receive the related email notification for this thread.