This is a migrated thread and some comments may be shown as answers.
Not able to reference kendo ui nested grid
2 Answers 26 Views
This is a migrated thread and some comments may be shown as answers.
viaindia
Top achievements
Rank 1
viaindia asked on 07 Sep 2016, 08:28 AM

Below is the kendo ui nested grid sample code and I highlighted the code which is the issue. Here I am trying to reference the nested grid inside a parent grid, but getting undefined exception. Not sure what I am doing wrong here.

var filterWorkOrderBundleDetails = function (DetailId) {
        var control = $("#grid_" + DetailId).data("kendoGrid");                                                              //(undefined): Not able to reference nested grid.
        //Todo

        return {            
            WorkOrderDetailId: DetailId
        }
    }

 

@(Html.Kendo().Grid<PM.Entities.Model.sp_Sel_WorkOrderDetailByWorkOrderNo_Result>()
    .Name("WorkOrderDetailGrid")
    .Columns(columns =>
    {
        columns.Bound(p => p.WorkOrderDetailNo).Title("Order Detail No").Filterable(e => e.Extra(false)).Width(80);
        columns.Bound(p => p.Description1).Title(productColumnTitle).Filterable(e => e.Extra(false)).Width(200);
        columns.Bound(p => p.AccountDetails).Title("Account").Filterable(e => e.Extra(false)).Width(200);
        columns.Bound(p => p.UnitPriceMultiplier).Title("Unit Price").Filterable(e => e.Extra(true)).Width(100).ClientTemplate("$#:kendo.toString(UnitPriceMultiplier, '" + @decimalFormat + "')#");
        columns.Bound(p => p.PartnerShare).Title("Partner Share").Filterable(e => e.Extra(true)).Width(100);
        columns.Bound(p => p.TelcoShare).Title(userSession.TenantName + " Share").Filterable(e => e.Extra(true)).Width(100);
        columns.Bound(p => p.Discount).Title("Adjustment").Filterable(e => e.Extra(true)).Width(100);
        columns.Bound(p => p.Description).Title("Description").Filterable(e => e.Extra(true)).Width(200);
    })
    .ClientDetailTemplateId("rowDetailTemplate")
    .DataSource(ds => ds
        .Ajax()
        .Read(read => read.Action("GetAppWorkOrderDetails1", "WorkOrder").Data("window.pm.order.tracking.filterWorkOrderDetails"))
        .PageSize(PageSize)
    )
    .NoRecords(NoRecordFound)
    .AutoBind(true)
    .Events(e => e.DataBound("window.pm.order.tracking.onDataBound"))
    .Pageable(page => page.PageSizes(PageSizes).Messages(msg => msg.Display("{0} - {1} of {2:n0} items")))
    .Scrollable(a => a.Height("auto"))
    .Sortable(s => s.SortMode(GridSortMode.MultipleColumn))
    .Resizable(e => e.Columns(true))
    .Reorderable(reorder => reorder.Columns(true))
    )
</div>

<script id="rowDetailTemplate" type="text/x-kendo-template">
    #if (WorkOrderDetailId != null){#
    @(Html.Kendo().Grid<PM.Entities.Model.sp_Sel_WorkOrderDetailByWorkOrderNo_BundleItems_Result>()
        .Name("grid_#=WorkOrderDetailId#")
        .Columns(columns =>
        {
            columns.Bound(o => o.WorkOrderNo).Title("Order").Width(80);
            columns.Bound(o => o.WorkOrderDetailNo).Title("Order Detail No").Width(80);
            columns.Bound(o => o.Partner).Title("Partner").Width(120);
            columns.Bound(o => o.BillChargeCode).Title("Charge Code").Width(80);
            columns.Bound(o => o.AccountDetails).Title("Account").Width(120);
            columns.Bound(p => p.UnitPriceMultiplier).Title("Unit Price").Filterable(e => e.Extra(true)).Width(100).ClientTemplate("$\\\\#:kendo.toString(UnitPriceMultiplier, '" + @decimalFormat + "')\\\\#");
            columns.Bound(p => p.Quantity).Title("Quantity").Filterable(e => e.Extra(true)).Width(100);
            columns.Bound(p => p.PartnerShare).Title("Partner Share").Filterable(e => e.Extra(true)).Width(100);
            columns.Bound(p => p.TelcoShare).Title(userSession.TenantName + " Share").Filterable(e => e.Extra(true)).Width(100);
            columns.Bound(p => p.Discount).Title("Adjustment").Filterable(e => e.Extra(true)).Width(100);
            columns.Bound(o => o.Description).Title("Description").Width(120);
        })
        .DataSource(dataSource => dataSource
            .Ajax()
            .PageSize(PageSize)
            .Read(read => read.Action("GetAppWorkOrderBundleDetails", "WorkOrder").Data("window.pm.order.tracking.filterWorkOrderBundleDetails('#=WorkOrderDetailId#')"))
        )
        .Pageable()
        .Scrollable(a => a.Height("auto"))
        .Sortable(s => s.SortMode(GridSortMode.MultipleColumn))
        .Resizable(e => e.Columns(true))
        .Reorderable(reorder => reorder.Columns(true))
        .ToClientTemplate()
    )
    #}else{  }#
</script>

 

Please help me!

2 Answers, 1 is accepted

Sort by
0
pat
Top achievements
Rank 1
answered on 12 May 2020, 12:39 PM

I stuck at this problems too , got undefined when calling subgrid id but i already checked in page, its grid is already rendered

0
Anton Mironov
Telerik team
answered on 15 May 2020, 12:09 PM

Hi, Viaindia and Pat,

At the time the "filterWorkOrderBundleDetails" JavaScript function is invoked, the inner grid has not been fully initialized. The instance of the grid could be obtained only after the initialization process has finished. All of the properties of the master row are available in the child grid. Is there a specific functionality you are willing to achieve? If yes, could you share more details on the scenario?

Accessing the properties from the master row has been demonstrated in point 7 of the following article:

https://docs.telerik.com/aspnet-core/html-helpers/data-management/grid/templates/client-detail-template#setting-the-client-hierarchy

Here is a sample implementation of the detailed grid's Read option:

.Read(read => read.Action("GetAppWorkOrderBundleDetails", "WorkOrder", new { workOrderDetailId = "#=WorkOrderDetailId#" }))
I hope this information helps.

 

 

Regards,
Anton Mironov
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
Tags
Grid
Asked by
viaindia
Top achievements
Rank 1
Answers by
pat
Top achievements
Rank 1
Anton Mironov
Telerik team
Share this question
or