TileLayout give Id to BodyTemplate

[Noah]

Hey i'd like to make a dashboard using the TileLayout Component in .Net Core. But I want to add different kinds of widgets from a List in the model. Each Container shall be added using one of many templates. I want the templates to render a partial view and have the views get their own data using the Id of the widget. But I don't know how to give the view the id of the container that is currently being created.

 

This is the code I have so far:

<div class="container-fluid">
@(Html.Kendo().TileLayout()
        .Name("dashboardLayout")
        .HtmlAttributes(new {style = "overflow:hidden;"})
        .Width(String.Format("{0}", (@customModel.ColumWidth * @customModel.ColumCount)))
        .Columns(@customModel.ColumCount)
        .RowsHeight(String.Format("{0}px", @customModel.RowHeight))
        .ColumnsWidth(String.Format("{0}px", @customModel.ColumWidth))
        .Gap(g => g.Columns(@customModel.VerticalGap).Rows(@customModel.HorizontalGap))
        .Reorderable(true)
        .Resizable(true)
        .Containers(c => {
            foreach(DashboardWidgetConfigurationModel widget in @customModel.Widgets) {
                c.Add().Header(h=>h.Text(@customModel.ColumWidth.ToString())).BodyTemplateId("single-value-circle-widget").ColSpan(5).RowSpan(2);
            }
        })
        .Events(e => e.Resize("onTileResize"))
    )
</div>

<script id="single-value-circle-widget" type="text/x-kendo-template">
    @await Html.PartialAsync("../Dashboard/SingleValueCircleWidget", #= widget #)  //the widget model contains the id
</script>

Long story short:

I want to access the current DashboardWidgetConfigurationModel from the foreach loop in the template.

[Alexander]

Hi Noah,

Thank you for reaching out.

I noticed that there is not a Telerik UI for ASP.NET Core license associated with your account which limits the availability of our support services for the product. In this regard, It is recommended that you either purchase or renew your license in order to gain access to the latest updates, fixes, features, and support regarding the Telerik UI for ASP.NET Core components. More information regarding the currently available plans can be reviewed here:

• Support Plans

Nevertheless, passing the id using a template syntax would not be possible, due to the fact the Partial.Async() is evaluated as a server-side code in comparison to the hash syntax which is client-side code. Therefore, this will result in de-synchronization within the custom template, as the template will not return the passed-in route value.

A possible approach would be to make an asynchronous request and specify an external Action that will be returning the corresponding partial view similar to how it is illustrated in the following StackOverflow thread:

• https://stackoverflow.com/questions/68095302/convert-renderaction-partial-view-asp-net-mvc-to-asp-net-core

And concatenating the required route values from the model:

@Url.Action("Create","WeightLostProgramDatas")?id=#=Id#"

I hope this helps.

Kind Regards,
Alexander
Progress Telerik