Razor Page
This article demonstrates how to add the Telerik UI TabStrip for ASP.NET Core to a RazorPage and load content via AJAX.
For the full project with RazorPages examples, visit our GitHub repository.
@inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Xsrf
@Html.AntiForgeryToken()
<div class="wrapper">
@(Html.Kendo().TabStrip()
.Name("tabstrip")
.Items(tabstrip =>
{
tabstrip.Add().Text("Dimensions & Weights")
.Selected(true)
.LoadContentFrom(Url.Content("~/Content/TabStrip/ajaxContent1.html"));
tabstrip.Add().Text("Engine")
.LoadContentFrom(Url.Content("~/Content/TabStrip/ajaxContent2.html"));
tabstrip.Add().Text("Chassis")
.LoadContentFrom(Url.Content("~/Content/TabStrip/ajaxContent3.html"));
})
)
</div>
<kendo-tabstrip name="tabstrip">
<items>
<tabstrip-item text="Dimensions & Weights"
selected="true"
content-url="@Url.Content("~/Content/TabStrip/ajaxContent1.html")">
</tabstrip-item>
<tabstrip-item text="Engine"
content-url="@Url.Content("~/Content/TabStrip/ajaxContent2.html")">
</tabstrip-item>
<tabstrip-item text="Chassis "
content-url="@Url.Content("~/Content/TabStrip/ajaxContent3.html")">
</tabstrip-item>
</items>
</kendo-tabstrip>
public void OnGet()
{
}