无法编辑ExtJS网格数据

Question

我正在创建两个网格。这两个网格将能够将项目彼此拖放以及自己拖放。此外，这些网格必须是可编辑的。我正在使用rowediting插件来编辑网格，但我总是得到错误“Uncaught TypeError：无法调用方法'getSelectionModel'未定义。”没有插件，网格工作正常，我没有任何错误。问题是什么？有人可以指出吗？我网格的代码是：

Ext.define('DHT.view.Configuration.CategoriesConfig', {
    extend: 'Ext.panel.Panel',
    requires: ['DHT.model.Category','Ext.grid.*'],
    alias: 'widget.categoriesconfig',
    layout: {
        type: 'hbox',
        align: 'stretch'
    },
    floating: true,
    closable: true,
    modal: true,
    height: 500,
    width: 800,
    title: 'Question Categories',    
    items: [{
        xtype: 'grid',
        title: 'Invisible',
        width: '47%',
        selType: 'rowmodel',   
        viewConfig: {
            plugins: [{
                ptype :'rowediting',
                clicksToEdit: 2
            },{
                ptype: 'gridviewdragdrop',
                dragGroup: 'invisible',
                dropGroup: 'visible'
            }, {
                ptype: 'gridviewdragdrop',
                dragGroup: 'invisible',
                dropGroup: 'invisible'
            }]
        },
        store: {
            model: 'DHT.model.Category',
            data: [
                { 'QuestionTypeID': 1, 'Description': 'A', 'SortOrder': 1 },
                { 'QuestionTypeID': 2, 'Description': 'B', 'SortOrder': 2 },
                { 'QuestionTypeID': 3, 'Description': 'C', 'SortOrder': 3 },
                { 'QuestionTypeID': 4, 'Description': 'D', 'SortOrder': 4 }
            ]
        },
        columns: [{
            xtype: 'actioncolumn',
            id: 'deleteButton',
            width: '5%',
            align: 'center',
            items: [{
                icon: 'Images/delete.png', tooltip: 'Delete'
            }]},
            {
                header: 'Order',
                dataIndex: 'SortOrder',
                width: '34%',
                sortable: false,
                menuDisabled: true
            },
            {
                header: 'Description',
                editable: true,
                editor: {
                        xtype: 'textfield',
                        allowBlank: false
                    },
                dataIndex: 'Description',
                width: '58%',
                sortable: false,
                menuDisabled: true
            }]
    },
    {
        xtype: 'panel',
        title: '',
        width: '6%',
        title: ' '
    },
    {
        xtype: 'grid',
        title: 'Visible',
        selType: 'rowmodel', 
        width: '47%',
        viewConfig: {
            plugins: [{
                ptype :'rowediting',
                clicksToEdit: 2
            },{
                ptype: 'gridviewdragdrop',
                dragGroup: 'visible',
                dropGroup: 'invisible'
            }, {
                ptype: 'gridviewdragdrop',
                dragGroup: 'visible',
                dropGroup: 'visible'
            }]
        },
        store: {
            model: 'DHT.model.Category',
            data: [
                { 'QuestionTypeID': 5, 'Description': 'E', 'SortOrder': 1 },
                { 'QuestionTypeID': 6, 'Description': 'F', 'SortOrder': 2 },
                { 'QuestionTypeID': 7, 'Description': 'G', 'SortOrder': 3 },
                { 'QuestionTypeID': 8, 'Description': 'H', 'SortOrder': 4 }
            ]
        },
        columns: [{
            xtype: 'actioncolumn',
            id: 'deleteButton',
            width: '5%',
            align: 'center',
            items: [{
                icon: 'Images/delete.png', tooltip: 'Delete'
            }]},
            {
                header: 'Order',
                dataIndex: 'SortOrder',
                width: '34%',
                sortable: false,
                menuDisabled: true
            },
            {
                header: 'Description',
                editable: true,
                editor: {
                        xtype: 'textfield',
                        allowBlank: false
                    },
                dataIndex: 'Description',
                width: '58%',
                sortable: false,
                menuDisabled: true
            }]
    }]
});

我的模特：

Ext.define('DHT.model.Category', {
    extend: 'Ext.data.Model',
    fields: [
                {
                    name: 'QuestionTypeID',
                    dataType: 'int'
                },
                {
                    name: 'Description',
                    dataType: 'string'
                },                
                {
                    name: 'SortOrder',
                    dataType: 'int'
                }
    ],
    idProperty: 'QuestionTypeID'
});

Answer 1

rowediting-plugin不是viewconfig的类型，而是网格本身的插件，因此你必须像这样定义：

viewConfig: {
    plugins: [
        {
            ptype: 'gridviewdragdrop',
            dragGroup: 'invisible',
            dropGroup: 'visible'
        }, {
            ptype: 'gridviewdragdrop',
            dragGroup: 'invisible',
            dropGroup: 'invisible'
        }
    ]
},

plugins: {
    ptype :'rowediting',
    clicksToEdit: 2
},