Kendo 下拉列表值未通过 class 选择器获取

Question

我正在使用 Kendo UI 框架开发 Web 应用程序。 HTML文件如下：-

<div class="grand_parent">

    <div class="parent1"> 
        <div class="child1"></div>
    </div>

    <div class="parent2">
        <div class="child2"></div>
    </div>

</div>

'grand_parent' class 将根据条件重复。在此 'child1' 和 'child2' 中，classes 将与 Kendo 下拉列表绑定。

$(".child1").kendoDropDownList({
    dataTextField: "text",
    dataValueField: "value",
    dataSource: options1,
    index: 0,
});

$(".child2").kendoDropDownList({
    dataTextField: "text",
    dataValueField: "value",
    dataSource: options2,
    change: onSelect,
    index: 0,
});


options1 = [
    {text:"Child1", value:1},
    {text:"Child2", value:2},
    {text:"Child3", value:3},
];

options2 = [
    {text:"newChild1", value:'5'},
    {text:"newChild2", value:'6'},
    {text:"newChild3", value:'7'},
];

function onSelect(e){
    var value = e.sender.value();
    switch (value) {
        case 5:
        case 6:
        case 7:

           // Printing a combination string of both drop downlist's selected value(Example: "5_1")

            break;

        default:

            break;
    }
}

获取下拉列表时出现问题 value.To 获取第一行 'child1 dropdownlist' 值（在第一行更改 'child2 dropdownlist' 时）我使用 $(this.element).closest(".parent2").siblings(".parent1").find(".child1").data("kendoDropDownList").value();

但是我得到如下错误：-

Uncaught TypeError: Cannot read property 'value' of undefined

请帮忙

Answer 1

将您的 DOM 导航表达式更改为：

$(this.element).closest(".parent2").siblings(".parent1").find("div.child1").data("kendoDropDownList").value();

Here 您可能会找到一个有效的示例。

基本上问题是 find(.child1) returns 2 DOM 个元素，您必须修复该选择器才能到达正确的组件。

Kendo 下拉列表值未通过 class 选择器获取

Kendo Dropdownlist value is not getting with class selector

kendo-dropdown