Kendo Grid绑定到字符串列表

时间:2013-03-20 15:46:31

标签: c# javascript asp.net-mvc kendo-ui kendo-grid

我有外部网络服务,所以我的控制器操作只返回带有Kendo网格的视图。

服务给我这样的结构:

{"Form":"xxx","Fields":["xxx","xxx","xxx"]}

我只对显示Fields值感兴趣。问题是Fields基本上是List<string>而不是KeyValuePair集合,所以我有一些麻烦将它绑定到网格。

我尝试使用解析事件并以某种方式更改数据,但没有成功。

到目前为止,我的观点中有这样的代码:

<div id="alias-list-view" class="k-content">
    <div id="alias-list-grid" style="width: 400px"></div>
</div>

var aliasListDataSource = new kendo.data.DataSource({
   transport: {
       read: {
           url: "some_url",
           dataType: "json"
       }
   },
    schema: {
        data: "Fields",
        parse: function (data) {
            $.each(data, function (index, item) {
                // not sure what to do
            });
        }
    },
   pageSize: 10
});


$("#alias-list-grid").kendoGrid({
    autoBind: false,
    dataSource: aliasListDataSource,
    pageable: true
});

2 个答案:

答案 0 :(得分:2)

您可以将parse函数定义如下:

parse: function (data) {
    var fields = data.Fields;
    var result = [];
    $.each(fields, function (index, item) {
        result.push({field: item })
    });
    return result;
}

然后是Grid

$("#alias-list-grid").kendoGrid({
    dataSource: aliasListDataSource,
    pageable  : true
});

即。 grid有一列我们称之为field,在我们迭代的解析函数中(正如您已经在做的那样)并组合field的对键值:value

示例:http://jsfiddle.net/OnaBai/BEM3S/

答案 1 :(得分:0)

您需要使schema的data属性返回一个执行操作的函数。检查这个小提琴:http://jsfiddle.net/whizkid747/9NsLR/3/

var dataFromService = {"Form":"xxx","Fields":["xxx1","xxx2","xxx3"]}
var aliasListDataSource = new kendo.data.DataSource({ 
    //data:movies,

schema:{
     data: function(response){
        var dataForDS = [];


         var len = dataFromService.Fields.length;

       for (var i = 0; i < len; i++) {                     
           var obj  = {
               title : dataFromService.Fields[i]
           };            
          dataForDS.push(obj);     
       }             
     return dataForDS;   
}    
}
});