Get inner items of grid

[ShareDocs]

Hi,

I have a problem to get the inner items of hierarchical grid.

This is the main grid:

 @(Html.Kendo().Grid(Model.List1)
        .Name("List1")
    .Columns(columns =>
    {
        columns.Bound(p => p.ColA).Title("ColA").Width(135);

        columns.Bound(p => p.ColB).Title("ColB").Width(110).Template(@<text>
          <a href='\\#' class='link' style="color:red;" onclick='UpdateItem(@item.ColC) '>@item.ColC</a>     
        </text>);

 })

    .Pageable()
    .Sortable()
    .Groupable()
    .DataSource(dataSource => dataSource.Server().PageSize(5))
    .HtmlAttributes(new { style = "height:500px;" })
    .DetailTemplate(

        @<text>
            @(Html.Kendo().Grid(item.InnerList)
                                    .Name("Inner_" + item.ListID)
                                    .Columns(columns =>
                                    {
                                    columns.Bound(o => o.ColD1).Title("ColD1").Width(110).HtmlAttributes(new { @class =  "btn-link", @style = "cursor: pointer;" }).HtmlAttributes(new { @onclick = "UpdateItem('"[e-mail]1+")" })
                       
                                        columns.Bound(o => o.ColD2).Title("ColD2").Width(110);
                                    })

                                 .DataSource(dataSource => dataSource.Server())
                                 .Pageable()
                                 .Sortable()
            )
        </text>
          )

 

______________________________________________

1. In the detail template I tried add a link to column ColD1 as in column ColC with .Template but it didn't work.

So I used HtmlAttributes instead to simulate a link :

I added: @class =  "btn-link", @style = "cursor: pointer;"  and it worked.

Why can't I use the .Template in the inner grid?

 

2. When I click on the link I want to run a javascript function. I tried sending the inner item as parameter to the function (as I did successfully in the main grid with @item) but it didn't work. 

I tried to send it in many ways:

1. @item.ColD1

2. o.ColD1

3.\\#= ColD1\\#

But none of the ways worked....

I'll be glad to receive your help,

Elad.

[Tsvetina]

Hi Elad,

This is a limitation of the Razor view engine. If you need to nest server templates, you can use helpers:

@model IEnumerable<Kendo.Mvc.Examples.Models.Employee>

    @{ Html.Kendo().Grid(Model)
              .Name("Employees")
              .Columns(columns =>
              {
                  columns.Bound(e => e.FirstName).Width(140);
                  columns.Bound(e => e.LastName).Width(140);
                  columns.Bound(e => e.Title).Width(200);
                  columns.Bound(e => e.Country).Width(200);
                  columns.Bound(e => e.City);
              })
          .DetailTemplate(f => RenderGrid(f))
              .RowAction(row =>
              {
                  if (row.Index == 0)
                  {
                      row.DetailRow.Expanded = true;
                  }
                  else
                  {
                      var requestKeys = Request.QueryString.Keys.Cast<string>();
                      var expanded = requestKeys.Any(key => key.StartsWith("Orders_" + row.DataItem.EmployeeID) ||
                          key.StartsWith("OrderDetails_" + row.DataItem.EmployeeID));
                      row.DetailRow.Expanded = expanded;
                  }
              })
              .Pageable()
              .DataSource(dataSource => dataSource.Server().PageSize(5))
              .Sortable()
              .Render();
    }

    @helper RenderGrid(Kendo.Mvc.Examples.Models.Employee employee)
    {
        @(Html.Kendo().Grid(employee.Orders)
            .Name("Orders_" + employee.EmployeeID)
            .Columns(columns =>
            {
                columns.Bound(o => o.OrderID).Width(101);
                columns.Bound(o => o.ShipCountry).Width(140);
                columns.Bound(o => o.ShipAddress).Width(200);
                columns.Bound(o => o.ShipName).Width(200).Template(@<text>
        <a href='\\#' class='link' style="color:red;" onclick='UpdateItem(@employee.EmployeeID) '>@employee.EmployeeID</a>
                </text>);
                columns.Bound(o => o.ShippedDate).Format("{0:d}");
             })
             .DataSource(dataSource => dataSource.Server())
             .Pageable()
             .Sortable()
             .Filterable()
    )
}

Regards,
Tsvetina
Progress Telerik

[ShareDocs]

Hi Tsvetina,

It works!!

Thanks for your help!

Elad

[ShareDocs]

Hi Tsvetina,

Its works!!

Thanks for your help!

Elad.