Request: Allow Wizard Steps to use Razor syntax for Content

Progress® Telerik® UI for ASP.NET Core Feedback Portal

Create an account Log In

Back to Feed

Request a Feature Report a Bug

Planned

Last Updated: 19 Nov 2024 08:58 by ADMIN

Scheduled for 2025 Q1 (Feb)

Alistair

Created on: 11 Sep 2024 13:52

Category: Wizard

Type: Feature Request

Request: Allow Wizard Steps to use Razor syntax for Content

Currently, the Content function for Steps in a Wizard only accepts a string value (see API here).
This means that in order to add a partial view (bound to the current model and its properties), the most straightforward way I could find was to put the partial view (and any wrappers) in its own file and add an extension method "ToHtmlString()". For example:

@model MyModel

@(Html.Kendo().Wizard().Steps(step => {
    step.Add().Content(Html.Partial("~/Path/To/View/Wrapper.cshtml", Model).ToHtmlString());
})

using Microsoft.AspNetCore.Html;
using System.IO;

public static class HtmlContentExtensions
{
    public static string ToHtmlString(this IHtmlContent htmlContent)
    {
        if (htmlContent is HtmlString htmlString)
        {
            return htmlString.Value;
        }

        using StringWriter writer = new();
        htmlContent.WriteTo(writer, System.Text.Encodings.Web.HtmlEncoder.Default);
        return writer.ToString();
    }
}

This is not ideal, as it requires the usage of Html.Partial (which displays a warning in the latest versions of .NET 8). It is also awkward as it sometimes means that new view files need to be created for the explicit purpose of being a "wrapper" even though they do not contain much content. And lastly, it also requires an extension method, so it's not immediately easy for other Telerik users to use.

In the Telerik TabStrip, a better approach is possible, as the Content for Items can take in a function which accepts Razor syntax (see API here). For instance:

@model MyModel

@(Html.Kendo().TabStrip().Items(tabstrip => {

    tabstrip.Add()
    .Content(@<div id="@Model.TabContainer" class="myTabWrapperClass"> 
       @await Html.PartialAsync("~/Path/To/View.cshtml", Model)
    </div>);

})

In this case, we can use Html.PartialAsync (avoiding .NET 8 warnings), we don't need an extension method, and it is easy to add any required "wrapping" such as a div with an ID, without needing a whole separate view.

If we had the option to use the same approach with Wizard Steps, that would be ideal!