0

给定表格中的数据:

var grid_data = [ {Hello: 'World'}, {Jesus:'Navas'} ]

我希望像这样画一个网格:

在此处输入图像描述

网格显示 2 行但没有数据,我在以下代码中找不到问题:

    var grid_store = Ext.create('Ext.data.Store', {
    fields: [
       {name: 'Property'},
       {name: 'Value'}
    ],
    data: grid_data
});

    // create the Grid
var grid_view = Ext.create('Ext.grid.Panel', {
    store: grid_store,
    renderTo: 'info_panel',
    stateful: true,
    stateId: 'stateGrid',
    columns: [
        {
            text     : 'Property',
            width    : 100,
            sortable : true,
            dataIndex: 'Property'
        },
        {
            text     : 'Value',
            width    : 80,
            sortable : false,
            dataIndex: 'Value'
        }
          ],
    height: 350,
    width: 600,
    title: 'Array Grid',
    viewConfig: {
        stripeRows: true
    }
});

呈现给:

<div id="info_panel"></div>

如果您想知道我是如何获得示例图像的,我将存储更改为 ArrayStore 并将数据重新格式化为数组,但我宁愿错过这一步并按原样插入数据。

编辑:

我认为我真正需要的是一种提醒 extjs 使用 JSON 键作为值的方法,而不是大多数采用以下形式的网格示例:

{value: 'Hello'}, {property: 'World'}
4

1 回答 1

2

作为评论者之一和您的编辑建议,您的网格被构建为使用 json,其中“属性”和“值”是 json 对象的键。我不知道您是否可以更改要在重新格式化的 json 中发送的数据源,但如果没有,您可以在收到数据后运行一个快速循环来执行此操作:

var new_data = [];
Ext.each(grid_data, function(obj) {
  for (var prop in obj) {
    new_data.push({
      Property: prop,
      Value: obj[prop]
    });
  }
}, this);
于 2013-01-14T15:55:11.810 回答