EXTJS-带有组合细胞编辑的Gridpanel



我有一个来自本地商店的网格面板。我添加了用于编辑type单元格的组合框。我希望我的组合盒从远程源中填充。但是我无法加载任何数据。这是我的代码:

ext.define('System.View.Maintab.NewConnection.Contacts',{ 扩展:'ext.grid.panel', 别名:'widget.newconnectioncontactspanel',

requires: [
    'Ext.grid.View',
    'Ext.grid.column.Column',
    'Ext.form.field.ComboBox',
    'Ext.toolbar.Toolbar',
    'Ext.toolbar.Fill',
    'Ext.button.Button',
    'Ext.grid.plugin.RowEditing'
],
height: 250,
width: 400,
itemId: 'contactsGridPanel',
title: 'My Grid Panel',
initComponent: function() {
    var records = [];
    var store = new Ext.data.ArrayStore({
        fields: [
            {name: 'type'},
            {name: 'value'}
        ]
    });
    store.loadData(records);
    var me = this;
    Ext.applyIf(me, {
        columns: [
            {
                dataIndex: 'type',
                xtype: 'gridcolumn',
                text: 'Type',
                flex: 1,
                editor: {
                    xtype: 'combobox',
                    displayField: 'neme',
                    valueField: 'id',
                    queryMmode: 'remote',
                    store: new Ext.data.JsonStore({
                        proxy: {
                            type: 'ajax',
                            url: '/ws/rest/contacts/getKeywords.json?keywordType=CONTACTS',
                            reader: {
                                type: 'json',
                                root: 'data',
                                idProperty: 'id'
                            }
                        },
                        autoLoad: true,
                        fields: [
                            {type: 'integer', name: 'id'},
                            {type: 'string', name: 'name'}
                        ]
                    })
                }
            },
            {
                dataIndex: 'value',
                xtype: 'gridcolumn',
                text: 'Value',
                flex: 1,
                editor: {
                    xtype: 'textfield'
                }
            }
        ],
        dockedItems: [
            {
                xtype: 'toolbar',
                dock: 'bottom',
                items: [
                    {
                        xtype: 'tbfill'
                    },
                    {
                        xtype: 'button',
                        itemId: 'removeBtn',
                        text: 'Remove'
                    },
                    {
                        xtype: 'button',
                        itemId: 'addBtn',
                        text: 'Add',
                        listeners: {
                            click: function (button, e, eOpts) {
                                var grid = button.up('#contactsGridPanel');
                                var store = grid.getStore();
                                var rowEditing = grid.getPlugin('rowediting');
                                rowEditing.cancelEdit();
                                var record = store.add({})[0];
                                rowEditing.startEdit(record, 0);
                            }
                        }
                    }
                ]
            }
        ],
        plugins: [
            Ext.create('Ext.grid.plugin.RowEditing', {
                pluginId: 'rowediting',
                listeners: {
                    edit: function() {
                    }
                }
            })
        ]
    });
    me.callParent(arguments);
}

});

这是我从服务器获得的JSON响应:

{
  "success": true,
  "data": [
    {
      "id": 1,
      "name": "Fax"
    },
    {
      "id": 2,
      "name": "Home page"
    }
  ]
}

无法使一切正常。组合盒是空的。我在做什么错?

最有可能的是您在displayField配置中具有错别字。

作为旁注,您应该真正说出您完成了什么样的调试。说您"无法实现它"并没有真正的帮助。请求会触及服务器吗?商店会收到数据吗?提及您所做的事情将帮助有人回答您。

您应该从远程源捕获列值。尝试添加映射属性。

autoLoad: true,
fields: [
   {type: 'integer', name: 'id', **mapping:'id'**},
   {type: 'string', name: 'name', **mapping :'name'**}
]

最新更新