Completed
Last Updated: 04 Sep 2020 13:16 by ADMIN
Release 2.17.0
shanthu
Created on: 08 May 2019 02:16
Category: UI for Blazor
Type: Feature Request
65
Busy indicator which is MVVM friendly
Most of the screens need to provide visual feedback to users when some work is in progress. We are using MVVM, this should play nice with MVVM pattern.
3 comments
ADMIN
Marin Bratanov
Posted on: 14 Oct 2019 18:48

Hi all,

Here's an update that shows how to do this with the current way the Window is used.

<TelerikButton OnClick="@DoLongWork">Do long work</TelerikButton>

<TelerikWindow @bind-Visible="@LoadingSignVisible" Modal="true">
    <WindowTitle>
        <strong>Please Wait</strong>
    </WindowTitle>
    <WindowContent>
        @*Add animated gif and styling to taste*@
        Please wait...we are processing your request.
    </WindowContent>
</TelerikWindow>

@code {
    bool LoadingSignVisible { get; set; }

    //this method must be async so the UI can be updated while waiting for the remote service
    async Task DoLongWork()
    {
        LoadingSignVisible = true;

        await Task.Delay(3000);//simulate long running operation

        LoadingSignVisible = false;
    }
}

 

Regards,
Marin Bratanov
Progress Telerik

 UI for Blazor
ADMIN
Marin Bratanov
Posted on: 31 May 2019 04:50
You can find attached below an example of such a loading sign. It shows how you can simulate this for a long-running async operation that can release the browser UI thread while waiting for a server response. Of course, if the complex calculation is done in the same thread and does not actually await a response, this will not work, because Blazor will update the DOM only once the entire logic has ran its course.

--Marin

Attached Files:
ADMIN
Marin Bratanov
Posted on: 08 May 2019 04:15
Hi Shanthu,

The following article explains how you can make a loading sign for a client app: https://docs.telerik.com/blazor-ui/knowledge-base/loading-sign-client-app. After the app has initialized, switching views in a client app is a resource-intensive operation that blocks the browser UI thread, so you can't render a component during that operation.

Perhaps an option for a loading sign can be available with server-side Blazor where there may be some latency in the network traffic and server responses, so I am leaving this idea open so its implementation will be considered when it becomes popular.


Regards,
Marin Bratanov
Progress TelerikUI for Blazor