Event handling with dialog

Radzen.Blazor Components
1

So I have a OpenAsync dialog that is opened over the top of my existing page. I have events that are being generated by a websocket in a inject service in the underlying page. What is the best model to get a visual component updated in the dialog? The dialog is databound to a singleton, so the data is changing, but the dialog is not updated. I am doing a StateHasChanged in the underlying page, but I suspect I need to do this in the dialog, but how?

Can I get a handle to the dialog in the underlying window somehow? I just need to run StateHasChanged against the dialog from the underlying page, but I have no access on that page to the dialog since it's being run async. I could set up some custom events/event handling, but I think that's overkill? Suggestions? Thanks!

2

The DialogService has a Refresh method which could help in your case.

1 Like
3

Tried

DialogService.Refresh(); and InvokeAsync(() => {  DialogService.Refresh() });

but neither worked. I have a cancel button that aborts the process and closes the dialog, and when I click it I see the progressbar go from zero to where it should be for a second before the dialog closes so I know the binding is working. But I cannot get the progressbar to update using Refresh? I guess I could move my websocket events into the dialog, but I thought I might reuse this dialog for several different processes if I can get the progressbar to update off changes in it's binding.

Perhaps I am not using DialogService.Refresh correctly?

4

I don't really know what you are doing. The Refresh method triggers the Refresh event of the DialogService. The dialog listens to it and calls StateHasChanged().

5

No, it doesn't seem to do anything?

So....I hooked this event handler into the dialog like so:

public partial class ProgressComponent : IDisposable
{
        [Inject]
        protected DialogService ds { get; set; }

       protected override void OnInitialized()
       {
          ds.OnRefresh += OnRefresh;
       }
       private void OnRefresh()
       {
          StateHasChanged();
       }
       ....................more code.....
}

and in the parent component I do:

InvokeAsync(() => { DialogService.Refresh(); });

and it works great! But if I just call Refresh without hooking the OnRefresh, the dialog does nothing...no updates at all? Is hooking the event intended, or is there indeed supposed to be a StateHasChanged in the default handler? If there is, it isn't working. Do you have a simple example of using DialogService.Refresh....perhaps with a timer that shows a progressbar updating?

Thanks!

6

I have linked the actual source code in my previous reply. You can check the default implementation.

7

So I looked at the source you linked, and it sure looks like calling DialogServer.Refresh should work. So, I've put together a very simple example project that shows that it doesn't. I emailed it to info@radzen.com.

Can you explain why I don't get the same result when clicking either button? Thanks!

8

Thank you for the example. Indeed the current implementation didn't handle this case - according to Blazor nothing changed in the Dialog component so it didn't update it. We will add some code to handle this case.

9

Ok, sounds good! Thank you for taking a look at this...I appreciate how quickly you guys fix stuff!