Progress bar on Index.html page in Blazor app

Radzen Studio Blazor Server
1

Can anyone indicate how to add a progress bar to the index.html page in a Client side app. At that point it's just HTML as the is still being created - so is it possible to put the generated code in the index.html page instead? I can create the progress bar on another page and then I have tried copying the generated div's and classes etc however the progress bar will not show :frowning:

2

Hi @markgr,

I don't think one can use a Blazor component like that. Even if you copy and paste the HTML of the progressbar the code required to make it a progressbar won't run.

3

It’s just a div and class - I got it working finally - when I have my laptop I’ll post code in case anyone wants it

4

Here is the code to create a progress bar on the index.html page before the APP loads....

<app>
        <div style="text-align:center; margin:100px auto 0 auto;">
            <!-- "Loading" spinner -->
            <div aria-valuemax="100" aria-valuemin="0" role="progressbar" class="ui-progressbar ui-widget ui-widget-content ui-corner-all ui-progressbar-indeterminate">
                <!--!-->
                <div class="ui-progressbar-value ui-progressbar-value-animate ui-widget-header ui-corner-all" style="display: block; width: 100%;"></div><!--!-->
            </div>
            <br /><br />
            <span>Loading...</span>
        </div>
    </app>