Javascript - 如何动态地将对象添加到kendo ui网格中的列数组?

Phi*_*uan 1 javascript kendo-ui kendo-grid

我试图在标题中暗示生成列数组中的对象,尽管我还没有找到一种工作方法.

alert( "Value 1: " + temporaryArray[1] + " - " + finalArray[1].values ); 
alert( "Value 2: " + temporaryArray[2] + " - " + finalArray[2].values ); 
var myGrid =  $("#grid").kendoGrid( 
{
    columns: 
    [
        {
            title: temporaryArray[0] + " ",
            field: gridArray[0].values + " "
        }
    ],
    dataSource: 
    {
        data:finalArray,
        pageSize:10
    },
    scrollable:false,
    pageable:true 
});
Run Code Online (Sandbox Code Playgroud)

我尝试了以下添加对象:

for( var x = 0; x < finalArray.length; x++ )
{
    myGrid[columns] = { temporaryArray[x]:finalArray[x] };
}
Run Code Online (Sandbox Code Playgroud)

for( var x = 0; x < finalArray.length; x++ )
{
    myGrid.columns[values]= finalArray[x].values;
}
Run Code Online (Sandbox Code Playgroud)

没有成功......

以下内容类似于我想要动态实现的对象内部的对象数组:

columns: 
[
    {
        title: temporaryArray[0] + " ",
        field: gridArray[0].values + " "
    },
    {
        title: temporaryArray[1] + " ",
        field: gridArray[1].values + " "
    },
    {
        title: temporaryArray[2] + " ",
        field: gridArray[2].values + " "
    }
],
Run Code Online (Sandbox Code Playgroud)

例如:

for( var x = 0; x < finalArray.length; x++ )
{
    myGrid[columns] = { temporaryArray[x]:finalArray[x] };
}
Run Code Online (Sandbox Code Playgroud)

我想使用for循环生成对象,以在列数组内生成对象数组.

我想知道的是,这是否可以动态完成?或者只是可能没有硬编码呢?

Ona*_*Bai 5

你能行的.让我们存储标题titleDefsfield名称fieldDef.然后你应该这样做:

// Title Definitions
var titleDefs = [
    "First Name", "Last Name", "Title"
];
// Field Definition
var fieldDefs = [
    "FirstName", "LastName", "Title"
];
// Lets compute column definition
var columnDefs = [];
for (var i = 0; i < titleDefs.length; i++) {
    columnDefs.push({ title : titleDefs[i], field: fieldDefs[i] });
}
// Now, create the grid using columnDefs as argument
var grid = $("#grid").kendoGrid({
    dataSource: {
        data    : dataArray,
        pageSize: 10
    },
    columns   : columnDefs
}).data("kendoGrid");
Run Code Online (Sandbox Code Playgroud)

注意:在此示例中,我已经定义了一个array内存中的JavaScript的DataSource,但您可以从服务器获取更改DataSource定义的数据.

注意:在您的代码中,您为title定义添加了额外的空白区域,这是不正确的:列定义是JavaScript代码而不是strings因此您不必在显示它时对其进行格式化.