Halil Ibrahim
Halil Ibrahim

Reputation: 1369

Kendo UI Grid - MVC - Looping collection of entity (view model) on ClientRowTemplate

Is it possible to create a clientrowtemplate with an entity model that includes a complex type of list to display some fields? I've created a server side rowtemplate but when I switch ajax on datasource, it doesn't work. I think it's expected. But how to create a complex template to display collections with ajax as a custom row template on MVC?

Upvotes: 0

Views: 1798

Answers (1)

Halil Ibrahim
Halil Ibrahim

Reputation: 1369

Solved

For clean code, seperate the delegate to any other code block. Notice the ToString() at the end of the code to get result as string, not as HelperResult.

@{
    Func<Grid<MyModel>, string> clientRowTemplate = @<div class="order-info">
        <div class="order-info-items cell">
        # if (data.OrderItemList) { #
            # for (var i in data.OrderItemList) { #
                # if (data.OrderItemList[i].ID) { #
                    <img src="#= data.OrderItemList[i].ImageUrl #" alt="#= data.OrderItemList[i].ItemName #" width="100" height="100" />
                # } #
            # } #
        # } #
        </div>
    </div>.ToString();
}

Then pass it as parameter to ClientRowTemplate method:

@(Html.Kendo().Grid(Model)
    .Name("grd")
    .Columns(columns =>
    {
        /*columns*/
    })
    .DataSource(dataSource => dataSource
        .Ajax()
        .Read(read => read.Action("Orders_Read", "Home"))
    )
    .ClientRowTemplate(clientRowTemplate)

Hope it helps.

Upvotes: 2

Related Questions