I have some code for a BlazorSidebar:
But what I want is that when one of the URLs in the sidebar is clicked, the sidebar toggles closed. I want the sidebar to close when I click a link, to reveal the full content of that clicked link's page. I have tried to do a ItemSelected="Toggle", but that did not work for some reason.
@code {
SfSidebar Sidebar;
public Orientation Orientation = Orientation.Horizontal;
public Orientation VerOrientation = Orientation.Vertical;
Dictionary HtmlAttribute = new Dictionary()
{
{"class", "sidebar-menu" }
};
Dictionary Tooltip = new Dictionary()
{
{"title", "sidebar-menu" }
};
public List
new MenuItem {
Text = "Home",
IconCss ="oi oi-home",
Url = "/"
},
new MenuItem {
Text = "Customers",
IconCss = "oi oi-people",
Url = "PagePaths.CUSTOMERS"
},
new MenuItem {
Text = "Products",
IconCss = "oi oi-briefcase",
Url = "/products"
},
new MenuItem {
Text = "Discounts",
IconCss = "icon-tag icon",
Url = "/discount-setup"
},
new MenuItem {
Text = "Data Management",
IconCss = "oi oi-calculator",
Url = "/data",
Items = new List
new MenuItem{ Text = "Daily Routes", Url = "/data?tab=daily-routes" },
new MenuItem{ Text = "Invoices", Url = "/data?tab=invoices" },
new MenuItem{ Text = "Acct Payments", Url = "/data?tab=acct-payments" },
new MenuItem{ Text = "Discrepancies", Url = "/data?tab=discrepancies" },
new MenuItem{ Text = "Customer Sales", Url = "/data?tab=customer-sales" }
}
},
new MenuItem {
Text = "Administration",
IconCss = "oi oi-graph",
Url = "/administration",
Items = new List
new MenuItem{ Text = "Web Users", Url = "/administration?tab=web-users" },
new MenuItem { Separator = true },
new MenuItem{ Text = "Devices", Url = "/administration?tab=devices" },
new MenuItem{ Text = "Device Users", Url = "/administration?tab=device-users" },
new MenuItem { Separator = true },
new MenuItem{ Text = "Trucks", Url = "/administration?tab=trucks" },
new MenuItem{ Text = "Truck Routes", Url = "/administration?tab=truck-routes" },
new MenuItem { Separator = true },
new MenuItem{ Text = "Company Settings", Url = "/administration?tab=company-settings" },
new MenuItem{ Text = "Audit Log", Url = "/administration?tab=audit-log" }
}
}
};
public bool SidebarToggle = false;
public void Toggle()
{
SidebarToggle = !SidebarToggle;
}
private void onSelect(MenuEventArgs
{
SidebarToggle = !SidebarToggle;
}
}
