1. Home
  2. Forum
  3. Blazor
  4. How to make a Sidebar initially hidden?

How to make a Sidebar initially hidden?

Hi team,

I would like to keep the Sidebar hidden when the UI is initially rendered. Could you please tell me how to achieve that? Thanks.

3 Replies 1 reply marked as answer
MK Muthukrishnan Kandasamy Syncfusion Team August 20, 2020 08:41 AM UTC

 
Hi Brian, 
 
Thanks for contacting Syncfusion support. 
 
We have validated your requirement in Syncfusion Blazor Sidebar component. Yes, we can prevent the Sidebar component being open on initial loading by assigning Sidebar type property(Push, Over, Slide). Please refer to the below code block. 
 
<SfSidebar @ref="SidebarObj" Position="@Position" Type="SidebarType.Over" HtmlAttributes="@HtmlAttribute"> 
                <ChildContent> 
                    <div class="title-header"> 
                        <div style="display:inline-block"> Sidebar </div> 
                        <span id="close" @onclick="@Close" class="e-icons"></span> 
                    </div> 
                    <div class="sub-title"> 
                        Place your primary content here. 
                    </div> 
                </ChildContent> 
            </SfSidebar> 
 
We have prepared a sample for your convenience, which can be downloaded from the below link. 
 
 
Please refer to the below KB documentation. 
 
 
To know more about Sidebar component, refer to the below links.   
   
   
   
   
 
Please let us know, if you need any further assistance. 
 
Regards, 
Muthukrishnan K 


Marked as answer
BR Brian August 21, 2020 02:07 AM UTC

Yeah, Type="SidebarType.Over", that it. Thanks a lot.

MK Muthukrishnan Kandasamy Syncfusion Team August 21, 2020 04:19 AM UTC

 
Hi Brian, 
 
Thanks for your update. 
 
We are glad to know that given solution works. Please let us know if you need any further assistance. 
 
 
Regards, 
Muthukrishnan K 


Loader.
Up arrow icon