如果kendo网格绑定到动态数据源,请调整列大小?

时间:2013-09-03 18:54:08

标签: grid kendo-ui

我正在尝试为我的kendo网格启用水平滚动。到目前为止,我已经听说您是否已将width添加到列定义中。但是,如果数据是动态的,你会怎么做?

我尝试过几件事。此代码可以帮助您理解这一点。

 var kgrid = $("#grid").kendoGrid({
    height: 155,
    pageable: true,
    dataSource:ds,
    dataBound:function(e){
        var m = kgrid.data('kendoGrid');            
        console.log('dataBound: ', m.columns);
    },
    dataBinding:function(e){
        var m = kgrid.data('kendoGrid');
        var obj = ds.view()[0];
        console.log('dataBinding columns before: ', m.columns);
        //for(x in obj){
        //    if(x[0] == '_')
        //        continue;
        //    m.columns.push({field: x, width:'200px'});
        //}
        console.log('dataBinding columns after: ', m.columns);
    }//,
    //columns:[
      //  {field:'col1', width: '200px'},
        //{field:'col2', width: '200px'},
        //{field:'col3', width: '200px'},
        //{field:'col4', width: '200px'}
        //]
});

此处还有指向我页面的链接:http://jsfiddle.net/deostroll/497zM/3/

我想为列设置一些大小,因此启用水平滚动。

1 个答案:

答案 0 :(得分:1)

我现在能看到的唯一方法就是完全销毁网格并在每次新数据到达时重新绑定它。当它到达时,我们必须采取第一项,阅读属性并创建columns数组。我们必须在这里设置每个对象的width属性,如下所述:

success: function (data) {
        var cols = [];
        var item = data[0];
        $.each(item, function (key, val) {
            cols.push({
                field: key,
                width: '325px'
            });
        });

        theGrid.kendoGrid({
            dataSource: {
                data: data,
                pageSize: 5
            },
            pageable: true,
            columns: cols,
            height: 225
        });
    } //end success

小提琴:http://jsfiddle.net/deostroll/497zM/5/