DialogService resizable and draggable closing bug

Radzen.Blazor Components
1

Hi, if I open a Dialog like the following

DialogService.OpenAsync<ItemSelectionComponent>("Test",
                new Dictionary<string, object>()
                {
                    { "Par1", "par1"},
                    { "Par2", "par2" }
                },
                new DialogOptions() { Width = "95%", Height = "95%", Resizable = true, Draggable = true  });

I have to click its titlebar before closing it with the X button otherwise the popup change position/size at the first closing X click and close itself only at the second X click.

2

Hi @davide.n,

Can you reproduce the problem here: GitHub. The first dialog (Open page in dialog) has resizing and dragging enabled. Here is what happens when I click the X button immediately.
draggable

3

I see, but I have this problem only if I set both Resizable and Draggable to true, if I set only one of the two to true the problem disappear.

4

Both are set to true in our demo.

    public async Task OpenOrder()
    {
        await DialogService.OpenAsync<DialogCardPage>($"Order {orderID}",
               new Dictionary<string, object>() { { "OrderID", orderID } },
               new DialogOptions() { Width = "700px", Height = "570px", Resizable = true, Draggable = true });
    }
5

I had the same issue. My main app component was offset by 250px due to a sidebar nav. I believe the style rule for .rz-dialog-wrapper should have left:0; to correct for this.

Adding this into my own stylesheet fixed the issue.

.rz-dialog-wrapper {
   left:0;
}
1 Like
6

I was having the same issue and this fixed it perfectly (thank you) except that the window was now showing up under the left navigation pane, so I just added a left in the DialogOptions (Left = "15%") and it's working great. Thank you