Sidebar toggle to hide sidebar by default

Radzen Studio Blazor Server
1

Hi,
I have tried a few things from other posts but cannot successfully hide the sidebar on load and allow the toggle to show the sidebar (the opposite of the normal layout sidebar functionality).

Radzen programatically toggle sidebar menu shows what I want to achieve regardless of device/browser but the github link is broken and just adding

sidebarExpanded = false;
bodyExpanded = true;

at layout load does not work.

There must be a simple answer, I just cannot see it.

2

I've updated the link. Here is it:

3

Thanks. How do I do this using the Radzen desktop app builder?

4

There is a partial class for every page/layout, you can add your custom code there or you can set Expanded properties in the Radzen designer.

5

It seems far too complex to hide the sidebar by default would it possible to add this option as a feature of the toggle in a future release?

6

Not sure how we can simplify this - all you need is to set Expanded properties to desired values.

7

I hear what you're saying but cannot seem to do this simple task, sorry. Can you show me a screenshot as to where the expanded properties are please?

8

Define a boolean property at page load
image

Then add custom to sidebar component
image
and then to body component
image

Now you can set values flgToggle variable in your code to expand/collapse sidebar as required

1 Like
9

Thanks @Vinod_Pillai
Doing this is successful to a point, I still have to add more code to the toggle button to be successful. I would have liked to do similar but with the property that is toggled by the default layout toggle. I still have to add more code to the toggle button to be successful.

@enchev I still feel that an option to set the default state on the toggle button properties would be easier. Especially when the toggle has not editable event tab.

image

1 Like
10

I agree. I think this would be a useful option to have.

11

We are working to provide Sidebar behavior similar to our Angular component i.e. the sidebar will auto-close when on small/mobile screens and/or resize. There will be no code for expanding in our default templates and everything will just work as expected.

1 Like
12

Hello I would love it to be an optional value also in the future.
For now i solved in in the new Radzen Layout with an extra class property:
RadzenSidebar class="@SideBarClass" etc

and then in:

protected override void OnAfterRender(bool firstRender)
{

    if (firstRender)
    {
        SideBarClass = "rz-sidebar-collapsed";
    }
    else
        SideBarClass = string.Empty;

}

This works for me.

1 Like