Currently, on mobile devices (where is no hover), to open the child menu you need to click/tap the parent and the only way close it afterwards is if you click away. This is not very convenient for mobile usage. I want to be able to close the child menu on click/tap of the parent as well.
Is there a way to not create menu programmatically but only using "html" elements ? Something like this :
<TelerikMenu>
<TelerikMenuItem Text="File">
<TelerikMenuItem Text="Open" OnClick="@OnFileOpenMenuClick"/>
<TelerikMenuItem Text="Save" OnClick="@OnFileSaveMenuClick"/>
</TelerikMenuItem>
</TelerikMenu>
I'm using the Menu component and I am handling the OnClick event. I noticed that when an exception is thrown in its handler, it does not reach the ErrorBoundary.
===
ADMIN EDIT
===
This issue also affects the SplitButton component.
The Menu uses the NavigationManager to go to the pages that are assigned to the individual MenuItem objects. Is there a way to pass the "force load" value to these menu items?
-------------------- ADMIN EDIT --------------------
You can work around the issue if you skip setting Url field of the items that you want to force load and set your own property. Then, handle OnClick of the menu items and check if this property is set and manually call the navigation manager for the URL. You can see the code for this approach below:
public List<MenuItem> MenuItems { get; set; }
protected void OnClickHandler(MenuItem item)
{
if (item.ForceLoadUrl != null)
{
navManager.NavigateTo(item.ForceLoadUrl, true);
}
}
public class MenuItem
{
public string Text { get; set; }
public string Url { get; set; }
public string ForceLoadUrl { get; set; }
public List<MenuItem> Items { get; set; }
}
protected override void OnInitialized()
{
MenuItems = new List<MenuItem>()
{
new MenuItem()
{
Text = "site.css",
ForceLoadUrl = "/css/site.css"
},
new MenuItem()
{
Text = "Counter",
Url = "/counter"
},
new MenuItem()
{
Text = "Fetch Data",
Url = "/fetchdata"
}
};
base.OnInitialized();
}
I need to style the entire menu item, not just my template, but there are classes from the menu that I cannot override with my code or template.
The current implementation of the component has hardcoded values for the alignment of the popup - e.g.:
for horizontal orientation: left horizontal align and bottom vertical align
for vertical orientation: right horizontal align and top vertical align
Ideally, those should be customizable to facilitate various use-cases.