Kendo UI 级联组合框:清除父组合框时未禁用子组合框

Kendo UI Cascading ComboBox: Child not disabled on clearing parent combobox

我在我们的项目中使用 Kendo UI MVC 版本“version:2016:1.112.545”,并且 Cascading ComboBox 中存在错误可以在 ASP.NET MVCHTML5/JavaScript[=48= 中的 Telerik Demos 中重现]PHP (http://demos.telerik.com/kendo-ui/combobox/cascadingcombobox).

(注意:组合框中的文本需要键入

重现步骤
访问给定的 URL.
在 Categories ComboBox 和 select Beverages
中键入字母 b 在 Products ComboBox 和 select Chai
中键入字母 c 在 Orders ComboBox 和 select Portland
中键入字母 p 现在清除 Categories ComboBox 中的文本,它将填充所有类别,但不要 select 任何类别,只需单击外部
请注意,所有 ComboBoxes 中的内容都被清除了,但是 Orders 下拉列表仍然可以访问,单击它会填充所有订单。

(注意:我在 Chrome 和 Firefox 中检查过,同样只是单击下拉菜单不会重现此问题。请按原样按照说明进行操作)

如果有人知道修复方法或破解方法,请分享。
(注意:我的许可证已过期,因此没有专门的支持或访问高级论坛主题)

不错的收获。它的错误在 kendo-ui 中,您也可以将此错误报告到 kendo-UI 错误跟踪中。

请尝试使用以下代码片段。

<!DOCTYPE html>
<html>
<head>
    <title>Jayesh Goyani</title>
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.1.112/styles/kendo.common.min.css">
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.1.112/styles/kendo.rtl.min.css">
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.1.112/styles/kendo.default.min.css">
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.1.112/styles/kendo.mobile.all.min.css">

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
    <script src="http://kendo.cdn.telerik.com/2016.1.112/js/angular.min.js"></script>
    <script src="http://kendo.cdn.telerik.com/2016.1.112/js/jszip.min.js"></script>
    <script src="https://github.com/downloads/SteveSanderson/knockout/knockout-2.0.0.debug.js"></script>
    <script src="http://kendo.cdn.telerik.com/2016.1.112/js/kendo.all.min.js"></script>
    <script src="http://rniemeyer.github.io/knockout-kendo/js/knockout-kendo.min.js"></script>
    <style>

    </style>
</head>
<body>

    <input id="categories" />
    <br />
    <br />
    <input id="products" disabled="disabled" />
    <br />
    <br />
    <input id="orders" disabled="disabled" />

    <script>
        $(document).ready(function () {
            var categories = $("#categories").kendoComboBox({
                filter: "contains",
                placeholder: "Select category...",
                dataTextField: "CategoryName",
                dataValueField: "CategoryID",
                dataSource: {
                    type: "odata",
                    serverFiltering: true,
                    transport: {
                        read: "https://demos.telerik.com/kendo-ui/service/Northwind.svc/Categories"
                    }
                }
            }).data("kendoComboBox");

            var products = $("#products").kendoComboBox({
                autoBind: false,
                cascadeFrom: "categories",
                filter: "contains",
                placeholder: "Select product...",
                dataTextField: "ProductName",
                dataValueField: "ProductID",

                dataSource: {
                    type: "odata",
                    serverFiltering: true,
                    transport: {
                        read: "https://demos.telerik.com/kendo-ui/service/Northwind.svc/Products"
                    }
                }
            }).data("kendoComboBox");

            var orders = $("#orders").kendoComboBox({
                autoBind: false,
                cascadeFrom: "products",
                filter: "contains",
                placeholder: "Select order...",
                dataTextField: "Order.ShipCity",
                dataValueField: "OrderID",
                dataBound: onDataBound,
                dataSource: {
                    type: "odata",
                    serverFiltering: true,
                    transport: {
                        read: "https://demos.telerik.com/kendo-ui/service/Northwind.svc/Order_Details?$expand=Order"
                    }
                }
            }).data("kendoComboBox");
        });

        function onDataBound(e) {
            if ($("#products").data("kendoComboBox").selectedIndex == -1) {
                $("#orders").data("kendoComboBox").enable(false);
            }
        }

    </script>

</body>
</html>

如有任何疑问,请告诉我。