Telerik mvc网格仅展开选定的行客户端模板

时间:2016-06-27 11:11:46

标签: c# jquery asp.net-mvc telerik

我有一个用于客户的网格和一个客户端模板中的另一个网格,它显示内联的客户资料。在扩展父网格的行时,我能够根据客户ID获取唯一的ID和负载配置文件这样可以很好地显示所选行下客户端模板网格中的配置文件。

但是,如果我在父窗口中选择另一个第二项,则该特定id的详细信息不会显示在该第二行客户端模板视图中,但它们将显示在第一行的第一个网格中,并显示正确的详细信息。第二个唯一的ID。据我所知,网格似乎进行了切换,而不是在第二行Grid上显示那些结果,它显示在第一行部分。如何能够确保对于每个选定的行,它显示它在相同行下的相应结果,但没有在第一行显示结果。

如果我在前面并且我选择另一个项目让我们说第4项,内联细节将在第一个网格中进行更改,但该特定行网格将不显示结果.Below是我网格的结构。

我按照此示例显示我的记录http://demos.telerik.com/aspnet-mvc/html5-dashboard-sample-app/Home/ProductsAndOrders

以下是我的网格。

                <script>
              function onDetailsDatabound() {
                    var firstRow = this.tbody.find("tr.k-master-row").first();
                    var model = this.dataItem(firstRow);
                    if (!model.isNew()) {
                        this.expandRow(firstRow);
                    }
                }
                function onCustomerInfoDisplay(e) {
                    if (!e.model.isNew()) {

                        e.container.find("[name=CustomerId]").data("kendoDropDownList").enable(false);
                    } else {
                        e.container.find("td.k-hierarchy-cell").css({ visibility: "hidden" });
                    }
                }
                function onDataBound(e) {
                    var firstRow = this.tbody.find("tr.k-master-row").first();
                    var model = this.dataItem(firstRow);
                    if (!model.isNew()) {

                        this.expandRow(firstRow);
                    }

                }

                function OnDetailExpand(e) {

                    $(e.detailRow).find('.t-grid').data().tGrid.ajaxRequest();
                }
            </script>


            <div>
                @(Html.Kendo().Grid(Model.CustomerDetails).Name("Customers")
                        .DataSource(x => x.Ajax().PageSize(100).Read("LoadCustomers", "Customer").Model(d =>
                    {
                        d.Id(e => e.CustomerId);
                        d.Field(a => a.CustomerId).Editable(false);

                    }).ServerOperation(false))

                    .Selectable()
                    .Pageable(s => s.Refresh(true))
                    .Navigatable()



                    .Columns(d =>
                    {

                        d.Bound(c => c.CustomerId).Title("CustomerData");

                        d.Bound(s => s.FirstName).Title("FirstName");
                        d.Bound(s => s.LastName).Title("LastName").Visible(true);
                        d.Bound(s => s.Email).Title("Email Address").Visible(false);


                    })
                    .BindTo(Model.Customers)
                            .Pageable(c => c.Enabled(true).PageSizes(true)).ClientDetailTemplateId("clientTemplate").Events(a => a.DataBound("onDataBound").DetailExpand("OnDetailExpand"))







                )




            </div>

            <script id="clientTemplate" type="text/x-kendo-template">


              @(Html.Kendo().Grid(Model.CustomerBio).Name("records").Columns(a =>
                        {
                            a.Bound(s => s.KinName);
                             a.Bound(s => s.KinIdNumber);
                              a.Bound(s => s.KinPostalCode);
                               a.Bound(s => s.KinCity);
                        }).DataSource(a => a.Ajax().Model(b => b.Id(x => x.ProfileId)).Read("GetCustomerBioByCustomerId", "Customer",new {CustomerId="#=CustomerId#"})).Events(a => a.DataBound("onDetailsDatabound").Edit("onCustomerInfoDisplay")).ToClientTemplate())


            </script>

1 个答案:

答案 0 :(得分:0)

我通过确保客户端模板网格名称是唯一的来解决它。问题是网格在显示结果时有相同的名称。这是更新的客户端模板网格名称我正在解析名称字段中的唯一ID

   <script id="clientTemplate" type="text/x-kendo-template">


          @(Html.Kendo().Grid(Model.CustomerBio).Name("CustomerDisplay#=CustomerId#"").Columns(a =>
                    {
                        a.Bound(s => s.KinName);
                         a.Bound(s => s.KinIdNumber);
                          a.Bound(s => s.KinPostalCode);
                           a.Bound(s => s.KinCity);
                    }).DataSource(a => a.Ajax().Model(b => b.Id(x => x.ProfileId)).Read("GetCustomerBioByCustomerId", "Customer",new {CustomerId="#=CustomerId#"})).Events(a => a.DataBound("onDetailsDatabound").Edit("onCustomerInfoDisplay")).ToClientTemplate())


        </script>

在这种情况下,每次展开网格行时都会为网格分配网格名称加上其唯一ID,因此确保没有网格名称相同。问题是因为所有子网格都具有相同的名称在第一个网格上显示结果