ExtJs双击网格行应该将项目移动到另一个网格

Posted 2023-02-26

【中文标题】ExtJs双击网格行应该将项目移动到另一个网格

【英文标题】：ExtJs double click on grid row should move item to another grid

【发布时间】：2015-08-19 19:46:06

【问题描述】：

我有两个网格，我想通过双击第一个网格将项目从一个网格移动到另一个网格。我在第一个网格中添加了一个侦听器，但无法在第二个网格中显示所选项目

                Ext.define('SessionGridPanel', 
                extend: 'Ext.grid.Panel',
                alias: 'widget.sessiongridpanel',
                listeners: 
                    itemdblclick: function (gridpanel, record, item, e) 

                        var selectedForm = Ext.create('SelectedPanel');                            
                        selectedForm.getStore.add(record);
                        //selectedForm.getStore().insert(0, [record]);
                        //selectedForm.getView().getStore().insert(0, record);
                    

下面是我的第二个网格

                Ext.define('SelectedPanel', 
                xtype: 'grid',
                itemId: 'myGrid',
                id: 'myIdGrid',
                extend: 'Ext.grid.Panel',
                alias: 'widget.selectedformpanel',
                store: 
                    fields: [
                         name: 'id', type: 'int' ,
                         name: 'title', type: 'string' ,
                         name: 'approved', type: 'bool' 
                    ]
                ,
                selModel: sm,
                columns: [
                    
                        text: 'Id',
                        xtype: 'gridcolumn',
                        sortable: true,
                        dataIndex: 'id'
                    ,
                    
                        text: 'Title',
                        xtype: 'gridcolumn',
                        sortable: true,
                        dataIndex: 'title'
                    ,
                    
                        text: 'Approved',
                        xtype: 'gridcolumn',
                        sortable: true,
                        dataIndex: 'approved'
                    
                ],
                dockedItems: [
                    xtype: 'container',
                    cls: 'eformscontainerbutton',
                    dock: 'top',
                    items: [
                        xtype: 'button',
                        id: 'moveUp',
                        action: 'moveUp',
                        margin: '4 10 4 0',
                        cls: 'sagitta-deluxe-button',
                        width: 105,
                        tooltip: 'Move Up',
                        text: 'Move Up'
                    ,
                        
                            xtype: 'button',
                            id: 'moveDown',
                            action: 'moveDown',
                            tooltip: 'Move Down',
                            margin: '4 0 4 10',
                            cls: 'sagitta-deluxe-button',
                            width: 105,
                            text: 'Move Down'
                        
                    ]
                ,
                
                    // container for the action buttons GENERATE FORMS, VIEW, and CLEAR
                    xtype: 'container',
                    cls: 'eformscontainerbutton',
                    margin: '2 0 2 0',
                    dock: 'bottom',
                    items: [

                        
                            xtype: 'button',
                            id: 'clear',
                            action: 'clearAll',
                            tooltip: 'Clear all selections',
                            margin: '4 3 0 10',
                            cls: 'sagitta-deluxe-button',
                            width: 105,
                            text: 'Clear'
                        ]
                ]

            );

我尝试 google，但无法获得任何与双击相关的信息，我尝试使用 store.add 和 store.insert 以相同的方式单击按钮，但这也不起作用。

【参考方案1】：

我在煎茶小提琴中为你做了一个小例子：https://fiddle.sencha.com/#fiddle/sg1

建立两个共享模式的商店。使用 add/remove 将 itemdblclick 监听器添加到网格中：

listeners: 
    itemdblclick: function(grid, record) 
        store2.add(record);
        store1.remove(record);
     

【参考方案2】：

在itemdblClick，试试这个：

itemDblClick: function() 
    var store =   gridpanel.getStore(); // this is store from where record will remove
    store.remove(record);
    var store1 = Ext.ComponentQuery.query('grid').getStore(); //  you can use any way to get other grid store.
    store1.add(record); // it will add record in last index of other grid