3-level hierarchy

2 posts, 0 answers
  1. Vivido
    Vivido avatar
    3 posts
    Member since:
    Jan 2015

    Posted 20 Mar 2015 Link to this post

    Hi, I'm trying to make a 3-level hierarchic grid. I've seen some example doing this but in my case the nested one is still dependent from the more external and I cannot access ID to populate it.
    My code:

    @(Html.Kendo().Grid<RateDayViewModel>()
                .Name("dayGrid")
                .Columns(columns =>
                {
                  columns.Bound(o => o.Date).Format("{0:d}");
                })
                   .ClientDetailTemplateId("channelTemplate")
                .DataSource(dataSource => dataSource
                    .Ajax()
                    .ServerOperation(false)
                    .Model(model =>
                    {
                      model.Id(p => p.DayID);
                    })
                    .PageSize(10)
                    .Read(read => read.Action("ReadSummary", "Rate"))
                )
                .Pageable()
        )
    <script id="channelTemplate" type="text/kendo-tmpl">
             @(Html.Kendo().Grid<RateChannelViewModel>()
                .Name("day_#=DayID#")
                .Columns(columns =>
                {
                  columns.Bound(o => o.Channel.Label).Title("Channel");
                })
                            .ClientDetailTemplateId("roomTemplate")
                .DataSource(dataSource => dataSource
                    .Ajax()
                    .Model(model =>
                    {
                        model.Id(p => p.ChannelID);
                    })
                                .Read(read => read.Action("ReadChannels", "Rate", new { Day = "#=DayID#" }))
                )
                .ToClientTemplate()
        )
    </script>
    <script id="roomTemplate" type="text/kendo-tmpl">
             @(Html.Kendo().Grid<RateRoomViewModel>()
                .Name("room_#=DayID##=ChannelID#")
                .Columns(columns =>
                {
                  columns.Bound(o => o.Room.Label).Title("Room");
                })
                .DataSource(dataSource => dataSource
                    .Ajax()
                    .Model(model =>
                    {
                        model.Id(p => p.RoomID);
                    })
                    .Read(read => read.Action("ReadRooms", "Rate", new { Day = "#=DayID#", Channel = "#=ChannelID#"}))
                )
                .ToClientTemplate()
        )
    </script>

    In the last one (Grid Room) I cannot access DayID property. How can I accomplish this?
  2. Daniel
    Admin
    Daniel avatar
    2230 posts

    Posted 24 Mar 2015 Link to this post

    Hello,

    The simplest option would be to include DayID in the RateChannelViewModel. An alternative would be to use the request data function to retrieve the DayID value via JavaScript e.g.
    Html.Kendo().Grid<RateRoomViewModel>()
        .Name("room_#=ChannelID#")
        ...
        .DataSource(dataSource => dataSource
            .Ajax()
            .Model(model =>
            {
                model.Id(p => p.RoomID);
            })
            .Read(read => read.Action("ReadRooms", "Rate", new { Channel = "#=ChannelID#"}).Data("function() { return getDayID('room_#=ChannelID#');}"))
        )
    function getDayID(gridId) {
        var masterRow = $("#" + gridId).closest("tr").parent().closest("tr").prev();
        var masterGrid = $("#dayGrid").data("kendoGrid");
        var item = masterGrid.dataItem(masterRow);       
        return {
            Day: item.DayID
        };
    }


    Regards,
    Daniel
    Telerik
     

    See What's Next in App Development. Register for TelerikNEXT.

     
Back to Top