Razor Page
This article describes how to configure the Telerik UI Breadcrumb for ASP.NET Core in a RazorPage scenario.
For the full project with RazorPages examples, visit our GitHub repository.
@inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Xsrf
@Html.AntiForgeryToken()
@(Html.Kendo().Breadcrumb()
.Name("breadcrumb")
.Items(items =>
{
foreach(var item in Model.Items)
{
items.Add()
.Type(item.IsRoot == true ? BreadcrumbItemType.RootItem : BreadcrumbItemType.Item)
.Href(item.Href)
.Text(item.Text)
.Icon(item.Icon)
.ShowText(true);
}
})
.Editable(true)
)
public List<BreadcrumbItem> Items { get; set; }
public void OnGet()
{
Items = new List<BreadcrumbItem>()
{
new BreadcrumbItem(){ Text = "All components", Href = "https://demos.telerik.com/aspnet-core/", Icon = "home", IsRoot = true},
new BreadcrumbItem(){ Text = "Breadcrumb", Href = "/breadcrumb", Icon= "globe", IsRoot = false },
new BreadcrumbItem(){ Text = "Icons", Href = "/icons", Icon="globe", IsRoot = false},
};
}
public class BreadcrumbItem
{
public string Href { get; set; }
public string Text { get; set; }
public string Icon { get; set; }
public bool IsRoot { get; set; }
}