单击父网格时无法显示子网格

Question

您好我正在使用Kendo UI网格使用mvc 4显示有关层次结构模型（父子网格模型）的信息。但是当我们点击父网格中的箭头标记时，我无法显示子网格...通过使用此引用hierarchy Grid Model

这是我对kendo UI网格的看法......

@Scripts.Render("~/bundles/jquery")
<script type="text/javascript">   
</script>    
@model IEnumerable<Topco.TopMapp.MVC.Models.CostPageSearch>
@{
    ViewBag.Title = "Index";
}    
<h2>Index</h2>
@using (Html.BeginForm())
{ 
   @(Html.Kendo().Grid<Topco.TopMapp.MVC.Models.CostPageSearch>()
        .Name("ParentGrids")
        .Columns(columns =>
        {
            columns.Template(@<text></text>).ClientTemplate("<input id='checkbox' onclick='grdChkBoxClick(this); ' class='chkbxq' type='checkbox' />").Width(30);
            columns.Bound(e => e.CostPage).Width(100);
            columns.Bound(e => e.Description).Width(100);
            columns.Bound(e => e.VendorName).Width(100);
            columns.Bound(e => e.BillTypeDirect).Width(100);
            columns.Bound(e => e.BillTypeWarehouse).Width(100);
            columns.Bound(e => e.VendorName).Width(100);

        })
        .Sortable()
        .Pageable()
        .Scrollable()
        .ClientDetailTemplateId("template")
        .HtmlAttributes(new { style = "height:430px;" })
        .DataSource(dataSource => dataSource
            .Ajax()
            .PageSize(6)
            .Read(read => read.Action("HierarchyBinding_Employees", "CostPageDisplay"))
        )
        .Events(events => events.DataBound("grid_dataBound"))
)
    <script id="template" type="text/kendo-tmpl">
         @(Html.Kendo().Grid<Topco.TopMapp.MVC.Models.ItemsDescriptionModel>()
            .Name("grid_#=EmployeeID#")
            .Columns(columns =>
            {
                columns.Template(@<text></text>).ClientTemplate("<input id='checkbox' onclick='grdChkBoxClick(this); ' class='chkbxq' type='checkbox' />").Width(30);
                columns.Bound(o => o.ItemId).Width(100);
                columns.Bound(o => o.ItemDescription).Width(100);
                columns.Bound(o => o.BrandCode).Width(100);
                columns.Bound(o => o.PackSize).Width(100);
            })
           .DataSource(dataSource => dataSource
               .Ajax()
               .PageSize(5)
               .Read(read => read.Action("HierarchyBinding_Orders", "CostPageDisplay"))
           )
           .Pageable()
           .Sortable()
           .ToClientTemplate()
   )
    </script>
<script>
    function grid_dataBound() {
        this.expandRow(this.tbody.find("tr.k-master-row").first());
        //alert('1');
    }
</script>

以及我想要展示的下面的图片

但我现在正在像这样获得图像

任何人都知道为什么我会得到这个，我需要改变任何宽度的父网格行.....请给我任何想法.... 非常感谢......

编辑：新图片但只能获得第一行（子网格）无法看到另一行子网格...（我正在使用此移动行从一个网格到另一个网格，仅检查行需要移动到另一个网格...）

@using (Html.BeginForm())
{ 
   @(Html.Kendo().Grid<Topco.TopMapp.MVC.Models.CostPageSearch>()
        .Name("ParentGrids")
        .Columns(columns =>
        {
            columns.Template(@<text></text>).ClientTemplate("<input id='checkbox' onclick='grdChkBoxClick(this); ' class='chkbxq' type='checkbox' />").Width(30);
            columns.Bound(e => e.CostPage).Width(100);
            columns.Bound(e => e.Description).Width(100);
            columns.Bound(e => e.VendorName).Width(100);
            columns.Bound(e => e.BillTypeDirect).Width(100);
            columns.Bound(e => e.BillTypeWarehouse).Width(100);
            columns.Bound(e => e.VendorName).Width(100);    
        })
        .Sortable()
        .Pageable()
        .Scrollable()
        .ClientDetailTemplateId("template")
        .HtmlAttributes(new { style = "height:480px;" })
        .DataSource(dataSource => dataSource
            .Ajax()
            .PageSize(6)
            .Read(read => read.Action("HierarchyBinding_Employees", "CostPageDisplay"))
        )
        .Events(events => events.DataBound("dataBound"))
)
    <script id="template" type="text/kendo-tmpl">
         @(Html.Kendo().Grid<Topco.TopMapp.MVC.Models.ItemsDescriptionModel>()
            .Name("grid_#=CostPage#")
            .Columns(columns =>
            {
                columns.Template(@<text></text>).ClientTemplate("<input id='checkbox' onclick='grdChkBoxClick(this); ' class='chkbxq' type='checkbox' />").Width(30);
                columns.Bound(o => o.ItemId).Width(100);
                columns.Bound(o => o.ItemDescription).Width(100);
                columns.Bound(o => o.BrandCode).Width(100);
                columns.Bound(o => o.PackSize).Width(100);
            })
           .DataSource(dataSource => dataSource
               .Ajax()
               .PageSize(5)
               .Read(read => read.Action("HierarchyBinding_Orders", "CostPageDisplay"))
           )
           .Pageable()
           .Sortable()
           .ToClientTemplate()
   )
    </script>
<script>
    function dataBound() {
        this.expandRow(this.tbody.find("tr.k-master-row").first());
        //alert('1');
    }
</script>        
    <input id="btnMove" type="button" value="Move" />        
   @(Html.Kendo().Grid<Topco.TopMapp.MVC.Models.CostPageSearch>()
        .Name("ParGrids")       
        .Columns(columns =>
        {
            columns.Template(@<text></text>).ClientTemplate("<input id='checkbox' onclick='grdChkBoxClick(this); ' class='chkbxq' type='checkbox' />").Width(30);
            columns.Bound(e => e.CostPage).Width(70);
            columns.Bound(e => e.Description).Width(70);
            columns.Bound(e => e.VendorName).Width(70);
            columns.Bound(e => e.BillTypeDirect).Width(70);
            columns.Bound(e => e.BillTypeWarehouse).Width(70);
            columns.Bound(e => e.OrderType).Width(70);   
        })
        .autoBind(false);
        .Sortable()  
        .Pageable()
        .Scrollable()       
        .ClientDetailTemplateId("DestinationTemplate")
        .HtmlAttributes(new { style = "height:480px;" })
        .DataSource(dataSource => dataSource
            .Ajax()
            .PageSize(5)
            .Read(read => read.Action("HierarchyBinding_Employees", "CostPageDisplay"))
        )
        .Events(events => events.DataBound("dataBound"))
)
    <script id="DestinationTemplate" type="text/kendo-tmpl">
         @(Html.Kendo().Grid<Topco.TopMapp.MVC.Models.ItemsDescriptionModel>()
            .Name("grid_=EmployeeID")
            .autoBind(false);
            .Columns(columns =>
            {
                columns.Template(@<text></text>).ClientTemplate("<input id='checkbox' onclick='grdChkBoxClick(this); ' class='chkbxq' type='checkbox' />").Width(30);
                columns.Bound(o => o.ItemId).Width(70);
                columns.Bound(o => o.ItemDescription).Width(70);
                columns.Bound(o => o.BrandCode).Width(70);
                columns.Bound(o => o.PackSize).Width(70);
            })
            .DataSource(dataSource => dataSource
               .Ajax()             
               .PageSize(6)
               .Read(read => read.Action("HierarchyBinding_Orders", "CostPageDisplay"))
           )
           .Pageable()
           .Sortable()
           .ToClientTemplate()
   )
    </script>
<script>
    function dataBound() {
        this.expandRow(this.tbody.find("tr.k-master-row").first());
        //alert('1');
    }
</script>

}

请在这里找到附件.. 对于此代码