Knockout-Kendo dropdownlist Ajax observableArray 获取选中项名称

Question

我的应用程序是 MVC 5，我使用以下 Knockout-kendo 下拉列表：

 <input data-bind="kendoDropDownList: { dataTextField: 'name', dataValueField: 'id', data: foodgroups, value: foodgroup }" />

   var ViewModel = function () {
        var self = this;
         this.foodgroups = ko.observableArray([
         { id: "1", name: "apple" },
         { id: "2", name: "orange" },
         { id: "3", name: "banana" }
         ]);
        var foodgroup =
        {
            name: self.name,
            id: self.id
        };

        this.foodgroup = ko.observable();
        ko.bindingHandlers.kendoDropDownList.options.optionLabel = " - Select -";
        this.foodgroup.subscribe(function (newValue) {
            newValue = ko.utils.arrayFirst(self.foodgroups(), function (choice) {
                return choice.id === newValue;
            });

            $("#object").html(JSON.stringify(newValue));
           alert(newValue.name);
        });
    };
    ko.applyBindings(new ViewModel());

效果很好，多亏了这个答案

然而，当我将 observableArray 更改为 Ajax:

       this.foodgroups = ko.observableArray([]),
                $.ajax({
                    type: "GET",
                    url: '/Meals/GetFoodGroups',

                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (data) {
                        self.foodgroups(data);
                    },
                    error: function (err) {
                        alert(err.status + " : " + err.statusText);
                    }
                });

控制器 - 从 ms sql 服务器获取 table：

 public JsonResult GetFoodGroups()
            {
                var data = db.FoodGroups.Select(c => new
                {
                    id = c.FoodGroupID,
                    name = c.FoodGroupName
                }).ToList();

                return Json(data, JsonRequestBehavior.AllowGet);
            }

当我提醒项目名称时出现此错误

 Unable to get property 'name' of undefined or null reference

使用Ajax对数组项进行硬编码有什么区别。

Answer 1

'id' 字段在硬编码数组中具有 string 数据类型。

'id' 字段在 ajax 数组中具有 number 数据类型。

.

因此，'id' 字段在两个数组中具有不同的数据类型。但是 in-condition 您使用了 === 运算符，因此它会检查 value 以及 datatype.

因为 ajax 数组值相同，但其数据类型不同，因此不会返回结果。

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

Knockout-Kendo dropdownlist Ajax observableArray 获取选中项名称

Knockout-Kendo dropdownlist Ajax observableArray get selected item name

asp.net-mvc

telerik

kendo-ui

knockout.js

kendo-dropdown