0

Considering that I have progress bar coded from this website https://www.geeksforgeeks.org/creating-progress-bar-using-javascript/.

I have one razor page with cshtml format and one razor page's code with cshtml.cs. Let's assume I have Index.cshtml and Index.cshtml.cs.

Index.cshtml

<style>
    #Progress_Status {
        width: 50%;
        background-color: #ddd;
    }

    #myprogressBar {
        width: 0%;
        height: 35px;
        background-color: #4CAF50;
        text-align: center;
        line-height: 32px;
        color: black;
    }
</style>

<div id="Progress_Status">
    <div id="myprogressBar"></div>
</div>

<script>
    function update(width) {
        var element = document.getElementById("myprogressBar");
        var identity = setInterval(scene, 10);
        function scene() {
            if (width >= 100) {
                clearInterval(identity);
            } else {
                width++;
                element.style.width = width + '%';
            }
        }
    }
</script>

Index.cshtml.cs

public async void OnGet()
{
    var progress = new Progress<int>(percent =>
    {

        //Do something
    });
    await Task.Run(() => TestFunction(progress));
}

public void TestFunction(IProgress<int> progress)
{
    int LoopCount = 1;
    while (LoopCount <= 100) 
    {
        if (progress != null)
        {
            progress.Report(LoopCount);
        }
        LoopCount += 1;
    }
}

My question is .. considering that I have a progressbar coded with the sample link above. How can I call the update function that exist in javascript in Index.cshtml.cs?

The usual upload file async that can update the progress bar exists in ASP.NET Core (stackoverflow or other website) does not work as this application does not involve with uploading file.

If this way of calling javascript function to update the progressbar is not recommended, is there any alternative way to do it?

2
  • Hi @Chrono, I think you can check this answer here:stackoverflow.com/a/42208569/11398810. Commented Nov 2, 2021 at 9:25
  • @Rena , thanks for your reply.. I will try that out if time allows me to do so but for the time being perhaps showing progress on terminal might not be that big of a deal for cross platform(Linux) users as this application is not running on server but it's running on user's Linux's device Commented Nov 3, 2021 at 5:46

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.