如何将嵌套 json 绑定到 Kendo 下拉列表 asp .net 核心？

Question

我在 kendo 下拉列表 asp 点网络核心中尝试了服务器绑定。但如果返回的 json 是嵌套格式

，则数据不会绑定

public async Task<IActionResult> GetListOfMenuCategory()
            {
                try
                {
                    var Categories = (await _menuCategoryRepo.GetAllAsync().ConfigureAwait(true));

                var menuCategoriesResponseData = Categories.Select(i => new
                { categoryId = i.CategoryId, name = i.Name}).ToList();
                return await this.SendSuccess(menuCategoriesResponseData).ConfigureAwait(true);
            }
            catch (Exception Ex)
            {
                _logger.LogError(Ex, Ex.Message);
                return await this.SendError(Ex.Message).ConfigureAwait(true);
            }
        }

它returns json 这种格式

"data":[{"categoryId":1,"name":"Momo"}]}

MY 查看代码以将数据绑定到 kendo 下拉列表

 @(Html.Kendo().DropDownListFor(a => a.MenuCategoryId)
                                .HtmlAttributes(new {style = "width:100%"})
                                .OptionLabel(new {
                                    name = "All",
                                    categoryId = 0})
                                .DataTextField("name")
                                .DataValueField("categoryId")
                                .DataSource(source =>
                                {
                                    source.Read(read =>
                                    {
                                        read.Action("GetListOfMenuCategory", "MenuCategory");
                                    });
                                })
                                )

输出为空下拉...任何人都可以帮我解决这个问题。

Answer 1

请修改后台代码，正确的json应该是：

[{"categoryId":1,"name":"Momo"}]

结果：

我的后端测试代码：

public async Task<IActionResult> GetListOfMenuCategory()
{
    var model = new List<Model>()
    {
        new Model(){ categoryId=1,name="Momo"}
    };
    return Json(model);
}

更新：

如果您不想更改 json，恐怕 Kendo MVC DropDownList 不支持此功能。它总是需要来自服务器的 JSON 数组。可以通过 JavaScript 初始化 DropDownList 并使用模式数据选项来实现：

@Html.TextBoxFor(m => m.MenuCategoryId)
   
<script>
    $(function () {
        jQuery("#MenuCategoryId").kendoDropDownList({
            dataSource: {
                transport: {
                    read: {
                        url: "/MenuCategory/GetListOfMenuCategory"
                    }
                },
                schema: {
                    data: "data"     //the importance here
                },
                serverFiltering: true
            },
            dataTextField: "name",
            dataValueField: "categoryId",
            index: 0
        });
    });
</script>

如何将嵌套 json 绑定到 Kendo 下拉列表 asp .net 核心？

How To bind nested json to Kendo Dropdownlist asp .net core?

asp.net-ajax

kendo-asp.net-mvc

kendo-dropdown

kendo-ui-mvc

asp.net-core