Kendo UI Treelist Расширить событие, предотвращающее расширение

Я настроил 3 кендо пользовательского интерфейса в одном представлении. Я пытаюсь расширить один список дерева из другого события расширения. Когда метод раскрытия вызывается из текущего события древовидной структуры, он расширяет указанный древовидный список, но предотвращает расширение текущего древовидного списка. Ниже приведен блок кода для того же. Может кто-нибудь пролить свет на то, где я ошибаюсь:

Html:

     <div id="products"></div>
     <div id="suppliers"></div>
     <div id="categories"></div>

JS:

    var data = [{"ProductID": 1,"ProductName": "Chai","ParentID": null,
    "UnitPrice": 18,"QuantityPerUnit": "10 boxes x 20 bags",
    "UnitsInStock":39,"UnitsOnOrder": },"ProductID":2,"ProductName":"Chang",
    "ParentID": null,"UnitPrice": 19,"QuantityPerUnit": 
    "24 - 12 oz bottles","UnitsInStock": 17,"UnitsOnOrder": 40},
    {"ProductID": 3,"ProductName": "Aniseed Syrup","ParentID": null,
    "UnitPrice": 10,"QuantityPerUnit": "12 - 550 ml bottles",
    "UnitsInStock": 13,"UnitsOnOrder": 70},{"ProductID": 4,
    "ProductName": "Chef Anton's Cajun Seasoning","ParentID": 1,                                                                                                                               "UnitPrice": 22,"QuantityPerUnit": "48 - 6 oz jars","UnitsInStock": 53,
     "UnitsOnOrder": 0},{"ProductID": 5,
     "ProductName": "Chef Anton's Gumbo Mix","ParentID": 2,
     "UnitPrice": 21.35,"QuantityPerUnit": "36 boxes","UnitsInStock": 0,
     "UnitsOnOrder": 0},{"ProductID": 6,
     "ProductName": "Grandma's  Boysenberry Spread","ParentID": 1,
     "UnitPrice": 25,"QuantityPerUnit": "12 - 8 oz jars",
     "UnitsInStock": 120,"UnitsOnOrder": 0},{"ProductID": 7,
     "ProductName": "Uncle Bob's Organic Dried Pears",
     "ParentID": 5,"UnitPrice": 30,"QuantityPerUnit": "12 - 1 lb pkgs.",
     "UnitsInStock": 15,"UnitsOnOrder": 0},{"ProductID": 8,
     "ProductName": "Northwoods Cranberry Sauce","ParentID": 6,
     "UnitPrice": 40,"QuantityPerUnit": "12 - 12 oz jars",
     "UnitsInStock": 6,"UnitsOnOrder": 0},{"ProductID": 9,
     "ProductName": "Mishi Kobe Niku","ParentID": 3,
     "UnitPrice": 97,"QuantityPerUnit": "18 - 500 g pkgs.",
     "UnitsInStock": 29,"UnitsOnOrder": 0},{"ProductID": 10,
     "ProductName": "Ikura","ParentID": 1,"UnitPrice": 31,
     "QuantityPerUnit": "12 - 200 ml jars","UnitsInStock": 31,
     "UnitsOnOrder": 0}];

    var dataSource = new kendo.data.TreeListDataSource({
        data: products,
        schema: {
            model: {
            id: "ProductID",
            parentId: "ParentID",
            fields: {
            ProductID: { type: "number", editable: false, nullable: false },
            ParentID: { type: "number", nullable: true },
            ProductName: { type: "string" },
            UnitPrice: { type: "number" },
            UnitsInStock: { type: "number" },
            UnitsOnOrder: { type: "number" },
            QuantityPerUnit: { type: "string" }
            }
        }

        }
    });
    $(document).ready(function () {


        // Create the TreeList
        $("#products").kendoTreeList({
        // Declare the TreeList columns
        columns: [

            { field: "ProductName", title: "Name" },
            { field: "UnitPrice", title: "Price" }
        ],
        // Bind the TreeList to the dataSource
        dataSource: dataSource,
        height: 500,
        scrollable:true
        });

        $("#suppliers").kendoTreeList({
            // Declare the TreeList columns
            columns: [
               { field: "QuantityPerUnit", title: "Quantity" },
               { field: "UnitPrice", title: "Unit Price" }
            ],
            // Bind the TreeList to the dataSource
            dataSource: dataSource,
            height: 500,
            scrollable: true
        });

    $("#categories").kendoTreeList({
        // Declare the TreeList columns
        columns: [

            { field: "UnitsInStock", title: "In Stock" },
            { field: "UnitsOnOrder", title: "On Order" }
        ],
        // Bind the TreeList to the dataSource
        dataSource: dataSource,
        height: 500,
        scrollable: true
    });

    var tlProducts = $("#products").data("kendoTreeList");
    var tlSuppliers = $("#suppliers").data("kendoTreeList");
    tlProducts.bind("expand", expandAll);

        function expandAll(e) {
            var index = tlProducts.tbody.find("tr[data-uid='" + e.model.uid + "']")[0].rowIndex;
            var dataItem = tlSuppliers.expand($("#suppliers tbody>tr:eq(" + index + ")"));


        }
    });

1 ответ

Решение

Для хакерского обходного пути, позвоните suppliers.expand в функции времени ожидания. Другое представление списка не может начать расширяться, пока первое представление списка не завершит расширение.

Другие вопросы по тегам