php - ExtJs 网格只查看一行

Question

我有 PHP 数组（$test_arr）如下所示

Array
(
    [0] => Array
        (
            [INV_ID] => 1
            [INV_TYPE_ID] => CART
            [INV_NO] => CPI0000001
            [INV_DATE] => 17-DEC-12
        )

    [1] => Array
        (
            [INV_ID] => 2
            [INV_TYPE_ID] => CART
            [INV_NO] => CPI0000002
            [INV_DATE] => 17-DEC-12
        )
)

我有这个数组的数据存储

  vertStore = new Ext.data.JsonStore 
  ({
  autoLoad: false,
  mode: 'local',
  data: <?php echo $test_arr; ?>,
  fields: 
  [
     'INV_NO',
     'INV_DATE'
  ]                           
  });

我的网格面板

  testPanelUi = Ext.extend(Ext.Panel, {
        width: 400,
        height: 250,
        initComponent: function() {
            this.items = [
                {
                    xtype: 'grid',
                    title: 'ccccc',
                    ref: 'test_ref',
                    id: 'panel_id',
                    columns: [
                        {
                            xtype: 'gridcolumn',
                            dataIndex: 'INV_NO',
                            header: 'INV NO',
                            sortable: true,
                            width: 100,
                            editable: false,
                            id: 'inv_no_id'
                        },
                        {
                            xtype: 'gridcolumn',
                            dataIndex: 'INV_DATE',
                            header: 'Date',
                            sortable: true,
                            width: 100,
                            editable: false,
                            id: 'date_id'
                        }
                    ]
                }
            ];
            testPanelUi.superclass.initComponent.call(this);
        }
    });

将我的商店加载到网格中

this.test_ref.store = vertStore;

但是这个网格只查看数组的第一个数据集（数组中的索引0数据集和网格只显示一行）。如何查看网格中的所有数据。

Answer 1

此网格的问题未在“test_ref”新网格内设置高度，如下所示

 testPanelUi = Ext.extend(Ext.Panel, {
    width: 400,
    height: 250,
    initComponent: function() {
        this.items = [
            {
                xtype: 'grid',
                title: 'ccccc',
                ref: 'test_ref',
                height: 400,
                autoHeight: true,
                id: 'panel_id',
                columns: [
                    {
                        xtype: 'gridcolumn',
                        dataIndex: 'INV_NO',
                        header: 'INV NO',
                        sortable: true,
                        width: 100,
                        editable: false,
                        id: 'inv_no_id'
                    },
                    {
                        xtype: 'gridcolumn',
                        dataIndex: 'INV_DATE',
                        header: 'Date',
                        sortable: true,
                        width: 100,
                        editable: false,
                        id: 'date_id'
                    }
                ]
            }
        ];
        testPanelUi.superclass.initComponent.call(this);
    }
});