Load content of the Tabstrip using ControllerAction method and not Partial View

[Renu]

I have list of tabs in my model like

var model = new List<TabModel>(){
new TabModel(){
Name = "Users",
ControllerName = "Home",
ActionName = "SearchUserData",
RequestValues = new {
area = "Admin",
userId = 12
}
},
new TabModel(){
Name = "Location",
ControllerName = "Home",
ActionName = "SearchUserLocation",
RequestValues = new {
area = "Admin",
userId = 12
}
},
new TabModel(){
Name = "Cities",
ControllerName = "Home",
ActionName = "SearchUserCity",
RequestValues = new {
area = "Admin",
userId = 12,
countryId = 1
}
},
};

In cshtml: my Tabstrip looks like this

Html.Kendo().TabStrip()
    .Name("admin-tab-strip")
    .Items(s =>
    {

        foreach (var item in Model)
        {
            if (item.ControllerName == "SearchUserData")
            {
                s.Add().Text(item.Name)
                    .Content(@Html.Action(item.ActionName, item.ControllerName, item.RequestValues).ToString())
                    .Selected(item.IsSelected);
            }
            else
            {
                s.Add().Text(item.Name)
                    .LoadContentFrom(item.ActionName, item.ControllerName, item.RequestValues)
                    .Selected(item.IsSelected);
            }
        }
    }))

Since Html.Action is no longer works in .net 8. Need suggestion to overcome this issue.
Now, I'm unable to navigate to the page which has this tabstrip due to Html.Action issue

[Ivan Danchev]

Hello,

With the removal of @Html.Action by Microsoft in the newer .NET versions, the available alternative is to load a ViewComponent in the tab.

The TabStrip tab would look like this:

s.Add().Text(item.Name).Content(@<text>
    @await Component.InvokeAsync("Navigation", new { OrderID = 1})
</text>

The view component class:

public class NavigationViewComponent
    : ViewComponent
{

    public IViewComponentResult Invoke(int OrderID)
    {
        OrderViewModel model = new OrderViewModel()
        {
            OrderID = OrderID
        };

        return View("Success", model);
    }
}

The view that is returned should be at the following location: Views\Shared\Components\Navigation

A couple of notes:

1. The name of the ViewComponent class and the folder in Views is Navigation. It is exemplary and a different name can be used.
2. The example posted above passes a parameter (OrderID) to the InvokeAsync method. And the method returns a view passing an instance of OrderViewModel. Again this is for the purposes of the example and instead a different model and parameters can be passed.

For more details on ViewComponents refer to: https://learn.microsoft.com/en-us/aspnet/core/mvc/views/view-components?view=aspnetcore-8.0&viewFallbackFrom=aspnetcore-2.1

Regards,
Ivan Danchev
Progress Telerik