asp.net-mvc - 无法将子网格绑定(bind)到剑道层次结构 UI 网格中的第二行

Question

我有父网格和子网格，我正在使用 kendo UI Grid (层次网格格式)将子网格数据绑定(bind)到父网格中的相应行，因为我只能为第一行显示子网格，而不能为另一行显示相同的详细信息 ...

这是我对该网格的看法......

@model IEnumerable<KendoSampleMVCApp.Models.EmployeesDetailsModel>
@{
    ViewBag.Title = "Index";
}
<h2>Index</h2>
@using (Html.BeginForm())
{ 
   @(Html.Kendo().Grid<KendoSampleMVCApp.Models.EmployeesDetailsModel>()
        .Name("ParentGrids")
        .Columns(columns =>
        {
            columns.Bound(e => e.EmployeeID).Width(100);
            columns.Bound(e => e.EmployeeFirstName).Width(100);
            columns.Bound(e => e.EmployeeSecondName).Width(100);
            columns.Bound(e => e.EmployeeCity).Width(100);         

        })               
        .Sortable()
        .Pageable()
        .Scrollable()
        .ClientDetailTemplateId("template")
        .HtmlAttributes(new { style = "height:430px;" })
        .DataSource(dataSource => dataSource
            .Ajax()
            .PageSize(5)
            .Read(read => read.Action("HierarchyBinding_Employees", "HierarchyGridDisplay"))            
        )               
)
    <script id="template" type="text/kendo-tmpl">
    @(Html.Kendo().Grid<KendoSampleMVCApp.Models.ShipDescriptionModel>()
            .Name("ChildGrids")
            .Columns(columns =>
            {
                columns.Bound(o => o.ShipAddress).Width(70);
                columns.Bound(o => o.ShipCountry).Width(70);
                columns.Bound(o => o.ShipName).Width(70);
            })
            .DataSource(dataSource => dataSource
                .Ajax()
                .PageSize(6)
                .Read(read => read.Action("HierarchyBinding_Orders", "HierarchyGridDisplay"))
            )
            .Pageable()
            .Sortable()
            .ToClientTemplate()
    )
    </script>
<script>
    function dataBound() {
        this.expandRow(this.tbody.find("tr.k-master-row").first());
    }
</script>
}

这是我的模型

public class EmployeesDetailsModel
{
    public string EmployeeID { get; set; }
    public string EmployeeFirstName { get; set; }
    public string EmployeeSecondName { get; set; }
    public string EmployeeCity { get; set; }        
}
public class ShipDescriptionModel
{
    public string ShipCountry { get; set; }
    public string ShipAddress { get; set; }
    public string ShipName { get; set; }       
}
public class EmployeeShipModel
{
    public EmployeesDetailsModel employeesshipments { get; set; }
    public ShipDescriptionModel shipinfo { get; set; }   
}

请您提出任何想法和需要在 view 中进行任何更改以将子网格数据显示到另一行...非常感谢

请看下面附上的图片

Answer 1

我相信这是因为您有一个网格的静态 ID。你应该试着给它一个动态的，这样就可以创建不同的子网格。这就是为什么它只适用于第一条记录，因为您没有网格名称的变体。尝试这样做:

 @(Html.Kendo().Grid<KendoSampleMVCApp.Models.ShipDescriptionModel>()
        .Name("ChildGrid_#=EmployeeID#")

发生的事情是父网格中的 EmployeeId 被拉下，并用于网格的命名约定。这样您就可以拥有任意数量的子网格。