This is a migrated thread and some comments may be shown as answers.

expanding hierarchy updates wrong table

2 Answers 34 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Entilzha
Top achievements
Rank 2
Entilzha asked on 12 Aug 2014, 09:43 PM
I have a weird problem that I will try to explain with the attached images.  I have hierarchy grid that works perfectly when I expand to the first sub-grid.  The problem happens when I expand a latter row in the main grid.  The result is the first expanded sub-grid gets the values of the newly expanded sub-grid (which is empty).  The attached pictures show the before and after.  I included a third image which shows that if you expand a row that is above the first expanded row then it works fine.

Here is the stripped down code.  Any help will be greatly appreciated!

BTW, the code formatter would not accept my Razor code with Javascript (using Chrome).  It got confused.  I hope this turns out okay when I hit "Post"...

@using Kendo.Mvc.UI
@model PatientToolsAdminDesk.Models.AdminPractitionerForm
@{
    ViewBag.Title = "Order History";
}

<div class="container">
    <div class="row">
        <div class="col-md-12">
            <div class="panel panel-primary" id="practitioner-panel">
                @Html.HiddenFor(a => a.did)
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-md-12">
            <div class="panel-body">
            @(Html.Kendo().Grid<PatientToolsAdminDesk.Models.PractitionerOrderHistory>()
                    .Name("order-history-grid")
                    .Columns(columns =>
                        {
                            columns.Bound(e => e.OrderID).Width(85);
                            columns.Bound(e => e.Status).Width(275);
                            columns.Bound(e => e.OrderType).Width(300);
                            columns.Bound(e => e.OrdererName).Width(150);
                            columns.Bound(e => e.Address);
                        })
                    .DataSource(dataSource => dataSource
                        .Ajax()
                        .Read(read => read.Action("HierarchyBinding_Orders", "Admin").Data("additionalData"))
                    )
                    .Sortable()
                    .Pageable()
                    .Scrollable()
                    .HtmlAttributes(new { style = "height:500px;" })
                    .ClientDetailTemplateId("orderdetailtemplate")
                )
            </div>
        </div>
    </div>
</div>

<script id="orderdetailtemplate" type="text/kendo-tmpl">
            @(Html.Kendo().Grid<PatientToolsAdminDesk.Models.PractitionerOrderItems>()
                .Name("order-item-grid")
                .Columns(columns =>
                {
                    columns.Bound(o => o.Quantity).Width(75);
                    columns.Bound(o => o.CreationDateShort).Width(100).Title("Date");
                    columns.Bound(o => o.Name).Width(250);
                    columns.Bound(o => o.GenericName).Width(250);
                    columns.Bound(o => o.Active).Width(50);
                })
                .DataSource(dataSource => dataSource
                    .Ajax()
                    .Read(read => read.Action("HierarchyBinding_OrderItems", "Admin", new { orderID = "#=OrderID#" }))
                )
                .Pageable()
                .Sortable()
                .ToClientTemplate())
</script>

<script>

    $(document).ready(function () {
        $("#searchnew").text("DID: " + $("#did").val());
        $("#searchnew").bind("click", function () {
            $("#searchwindow").data("kendoWindow").center().open();
        });
    });

    function SearchPractitioner(arg) {

        var did = $("#search_did").val();
        var orderid = $("#search_orderid").val();
        if (!((did == "") && (orderid == ""))) {
            var grid = $("#items-grid").getKendoGrid();
            grid.dataSource.data([]);

            $.ajax({
                type: 'GET',
                dataType: "json",
                url: '/admin/GetPractitioner',
                data: { 'did': did, 'orderid': orderid },
                success: onSearchPractitioner
            });
        } else {
            $("#did").val("");
            $("#orderid").val("");

            $("#searchnew").text("DID: " + 'unknown');

            var grid = $("#items-grid").getKendoGrid();
            grid.dataSource.read();

            var grid = $("#order-history-grid").getKendoGrid();
            grid.dataSource.read();
        }
    }

    function onSearchPractitioner(arg) {

        $("#searchwindow").data("kendoWindow").close();

        $("#did").val(arg.did);
        $("#orderid").val(arg.orderid);
        $("#firstname").html(arg.firstname);
        $("#lastname").html(arg.lastname);
        $("#degree").html(arg.degree);

        $("#searchnew").text("DID: " + arg.did);

        var grid = $("#items-grid").getKendoGrid();
        grid.dataSource.read();

        var grid = $("#order-history-grid").getKendoGrid();
        grid.dataSource.read();
    }

    function additionalData() {
        return {
            did: $("#did").val(),
        };
    }
</script>

2 Answers, 1 is accepted

Sort by
0
Entilzha
Top achievements
Rank 2
answered on 13 Aug 2014, 04:44 PM
I believe I found the problem.  I took out the dynamic grid naming mechanism.  This caused all of the _activated_ rows for each table to have a grid with the same name. DOH!

e.g., added the bold part
.Name("order-item-grid_#=OrderID#")
0
Nikolay Rusev
Telerik team
answered on 14 Aug 2014, 01:54 PM
Hello Entilza,

Indeed this is *must*.  Otherwise all detail grids will have same id html attribute. Adding template expression will ensure that all detail rows will have grids with unique names.

Regards,
Nikolay Rusev
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
Grid
Asked by
Entilzha
Top achievements
Rank 2
Answers by
Entilzha
Top achievements
Rank 2
Nikolay Rusev
Telerik team
Share this question
or