We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
close icon

The scrollbar disappears when SfDialog is shown in full screen and a target is set

Hi, I stumbled upon a strange behavior with the SfDialog.

When I set a "Target" and call "ShowAsync(true)" to show the dialog in fullscreen, everything works fine. But after I call "HideAsync" the scroll bar of the page disappears and scrolling is no longer possible.

I first noticed the behavior in a ".NET MAUI Blazor" project, but I was able to recreate it in a "Blazor Server" project as well. I have attached an example project.

As far as I can see, it has something to do with the CSS classes "e-dlg-target" and "e-scroll-disabled". These are set on the "target element" as well as on the "body" when the dialog is opened. However, when closing the dialog, these classes are only removed from the "target element", but not from the "body".

So my workaround is to manually remove the CSS classes from the "body".

But I don't think this behavior is intentional, so I wanted to let you know about it.

Greetings Florian

Attachment: SfDialogExample_9633ec57.zip

2 Replies

VJ Vinitha Jeyakumar Syncfusion Team February 14, 2023 01:40 PM UTC

Hi Florian ,

We have considered the reported issue "Page scrollbar got removed after closing the Dialog with target property" as a bug from our end and the fix for the issue will be included with our upcoming patch release on 28th  Feb 2023.

Now you can track the status of the reported issue through the feedback below,

Disclaimer: “Inclusion of this solution in the weekly release may change due to other factors including but not limited to QA checks and works reprioritization.”



VY Vinothkumar Yuvaraj Syncfusion Team March 2, 2023 11:27 AM UTC

Hi Florian,

We have included the fix for the issue "Page scrollbar got removed after closing the Dialog with target property" with our package version 20.4.52. So, can you please upgrade your package to the latest to resolve the issue from your end.

Release noteshttps://blazor.syncfusion.com/documentation/release-notes/20.4.52?type=all#dialog

Live Chat Icon For mobile
Up arrow icon