Kendo网格列客户端模板可以像ListView一样另一个kendo对象吗?

时间:2012-12-04 21:47:16

标签: kendo-ui

我真的有两个问题。一个是可能的,两个怎么做? RoleModel Type有一个PernModel的IEnumberable,我希望该列显示为列表视图。类似的东西。我不确定如何将listview绑定到Permissions对象。

@(Html.Kendo().Grid<RoleModel>()
    .Name("RoleGrid")
    .Columns(x =>
                 {
                     x.Bound(p => p.Name).Width(150);
                     x.Bound(p => p.Description).Width(350);
                     x.Bound(p => p.Permissions).ClientTemplate("test");
             }))


<script type="text/x-kendo-template" id="test" >
    @(Html.Kendo().ListView<PermissionModel>().Name("listView").AutoBind(true).ToClientTemplate()                                                                                                                                                                                                                                                               )
</script>

1 个答案:

答案 0 :(得分:2)

您可以 - 您应该使用网格的 dataBound 事件,找到您要放置列表视图并初始化列表视图的每个单元格 - 首先传递带有项目的集合使用网格的dataItem方法检索它。

为了更清楚,这里是一个例子:

@(Html.Kendo().Grid<Person>().Name("grid")
        .DataSource(dataSource => dataSource
            .Ajax()
            .Model(model=>model.Id(m=>m.PersonID))
                .Read(read => read.Action("GetPersons","Home"))                    
        )

        .Columns(columns =>
        {
            columns.Bound(c => c.PersonID);
            columns.Bound(c => c.Name).ClientTemplate("test");
            columns.Bound(c => c.Children).ClientTemplate("<div class='myView'></div>");                
        })
        .Events(ev=>ev.DataBound("db"))
    )

<script type="text/javascript">
    function db() {
        $.each($('.myView'), function () {
            var grid = $('#grid').data().kendoGrid;
            var row = $(this).closest('tr');
            var dataItem = grid.dataItem(row);
            $(this).kendoListView({
                dataSource: { data: dataItem.Children },
                template: kendo.template($("#templateLV").html())
            });
        });
    }
</script>

<script type="text/foo" id="templateLV"> 
#=TestID# testid is a property of the Child model
</script>
祝你好运