How to pass state change from MainLayout to Body

steamonimo · June 27, 2020, 5:54pm

In my MainLayout I can trigger an operation that will change variable X. This variable is in a service class that is scoped to the current session.

Im my RadzenBody element the current page will be shown. Some of these pages are binding to the same variable X of the scoped service class.

The problem is that StateChanged in MainLayout will update all references to X in MainLayout. But it will not update the page in RadzenBody referencing X. The change of global variable X is not published to the body page. It would be necessary to do something like StateChanged in the body page as well to reflect the new value of the variable.

Do you have any ideas how the event could be propagated?

enchev · June 28, 2020, 6:05am

You can use event. Check for example security service in Blazor WebAssembly app:

github.com

akorchev/radzen/blob/master/BlazorCRMWasm/client/Services/SecurityService.cs#L21


using Microsoft.AspNetCore.Components.WebAssembly.Hosting;
using Radzen;
using System.Text;
using System.Text.Json;
using Microsoft.AspNetCore.Components.Authorization;


namespace BlazorCrmWasm
{
    public class SecurityService
    {
        public event Action Authenticated;


        private readonly HttpClient httpClient;
        private readonly Uri baseUri;
        private readonly NavigationManager navigationManager;
        private readonly AuthenticationStateProvider authenticationStateProvider;


        public SecurityService(NavigationManager navigationManager, AuthenticationStateProvider authenticationStateProvider, HttpClient httpClient)
        {
            this.httpClient = httpClient;
            this.baseUri = new Uri($"{navigationManager.BaseUri}auth/");

steamonimo · June 28, 2020, 7:52pm

Thanks! This was easy to implement:

Scoped Service (create additional property):
-public event Action OnSomethingHasHappened;

Sub page:
-OnInitialized: service.OnSomethingHasHappened += MyReaction;
-private Action MyReaction() { ... StateHasChanged(); }

Mainlayout:
-private void SomethingHasChanged() => OnSomethingHasChanged?.Invoke();
-button will trigger { ... SomethingHasChanged() }
=> Sub page will receive event and update via StateHasChanged

Joshua_Serwatien · October 18, 2020, 5:13am

Hi. I'm trying to do the opposite. I'm trying affect a StateHasChange trigger in the MainLayout from a sub page. Do you have an example of this? Thank you

korchev · October 19, 2020, 5:13am

As far as we know this is not possible out of the box.

Penfold · December 17, 2021, 3:57am

I know this is way to late but for anyone else I found an easy way to update the master layout from the Page. Simply navigate to the page itself. When you call the Radzen "Navigate to page" it refreshes both the layout and the page. See example below this is called from the Cart page and simply navigates to the Cart page to refresh everything.

Joshua_Serwatien · February 7, 2023, 9:10pm

I was able to do it using APpState: