使用数据源加载 Kendo UI 面板栏

问题描述

我正在尝试使用数据源动态加载面板栏.实际上，在文档中，我仅获得了使用 ajax 的信息，所以我是这样实现的，

I am trying to load panelbar dynamically using datasource.Actually In the documentation I got information with using ajax only,so I have implemented like this,

    $.ajax({
                type: "POST",
                url: '/Home/GetPanelInfo',
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (json) {

                    $("#panelBar").kendoPanelBar({
                        expandMode: "single",
                        id: "usr_id",
                        dataSource: [{ text: json[0].groups_name, expand: true, contentUrl: "/Home/Index" },
                                     { text: json[1].groups_name, expand: true, contentUrl: "/Home/Index" },
                                     { text: json[3].groups_name, expand: true, contentUrl: "/Home/Index"}]
                    });
                }
});

但是这样我无法显示所有值，我认为这不是加载面板栏以显示所有值的正确方法，如何在面板栏中显示所有值

but with this I am not able to display all values,I think this is not the correct way of loading panel bar to display all values,How to display all values in panelbar

推荐答案

您应该迭代结果数组.您可以使用 jQuery Map 函数 例如:

You should be iterating over your result array. You can use jQuery Map function E.g.:

$.ajax({
            type: "POST",
            url: '/Home/GetPanelInfo',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (json) {
                var dataSource = $.map(json, function(obj){
                    return {
                        text: obj.groups_name,
                        expand: true,
                        contentUrl: "/Home/Index"
                    };
                });

                $("#panelBar").kendoPanelBar({
                    expandMode: "single",
                    id: "usr_id",
                    dataSource: dataSource
                });
            }
});

这篇关于使用数据源加载 Kendo UI 面板栏的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！