ext js 4 grid multiselect

时间:2012-12-19 09:50:19

标签: extjs extjs4

我有网格

 Ext.define('a.view.a', {
     extend: 'Ext.grid.Panel',
     alias: 'widget.list',
     store: 'a.store.store',
     multiSelect: false,
     enableKeyEvents: true,

     initComponent: function() {
         var me = this;
         var user = TR.user;
         this.addEvents('edit');

         this.columns = [{
             dataIndex: 'Id',
             width: 50,
             align: 'center',
             sortable: false
         }];

         this.actions = {
             edit: Ext.create('Ext.Action', {
                 text: 'Изменить заявку',
                 icon: 'Content/Resources/images/editDoc.gif',
                 cls: 'selected-griditem-button',
                 handler: function() {
                     this.fireEvent('edit', this.getRequest());
                 },
                 scope: this
             })
         };

         var contextMenu = Ext.create('Ext.menu.Menu', {
             items: [
                 this.actions.edit
             ]
         });

         this.on({
             itemcontextmenu: function(view, rec, node, index, e) {
                 this.getSelectionModel().select(index);
                 e.stopEvent();
                 contextMenu.showAt(e.getXY());
                 return false;
             },
             beforeitemdblclick: function(gr, rowIndex, e) {
                 this.fireEvent('edit', this.getRequest());
             }
         });

         this.viewConfig = {
             listeners: {
                 itemkeydown: function(v, r, item, index, e) {
                     if (e.getKey() == e.DELETE) {
                         e.stopEvent();
                         this.fireEvent('del', this.getRequest());
                     }
                 },
                 scope: this
             }
         };

         this.callParent(arguments);
     },
     getRequest: function() {
         var sm = this.getSelectionModel();
         var rs = sm.getSelection();
         if (rs.length) {
             return rs[0];
         }
         return null;
     }
 });

在我的控制器中,当我点击网格中的项目

时,我有exec的功能
onSelectionChange: function (sm, rs) {
   alert('wtf');
}

问题是

  1. 当我第一次点击网格中的项目时,我的消息框中包含" wtf"第二次在同一项目上 - 没有(这很好)

  2. 但是当我做multiSelect时:是的 每当我点击相同的项目时我都有消息(这不好:()

  3. 如何使用multiSelect: true

    进行第一个变体

1 个答案:

答案 0 :(得分:0)

使用'itemclick'事件代替'selectionchange'事件。这是一个独立的例子:

Ext.onReady(function () {

    Ext.define('Model', {
        extend: 'Ext.data.Model',
        fields: [
            {name: 'field1'},
        ],
        idProperty: 'field1'
    });

    Ext.define('Grid', {
        extend: 'Ext.grid.Panel',
        multiSelect: true,

        initComponent: function () {
            this.store = Ext.create('Ext.data.ArrayStore', {
                model: 'Model',
                data: [
                    ['value1'],
                    ['value2'],
                    ['value3']
                ]
            });

            this.columns = [
                {dataIndex: 'field1', flex: 1}
            ];
            this.callParent(arguments);
        }
    });

    var grid = Ext.create('Grid', {
        renderTo: Ext.getBody()
    });

    grid.on('selectionchange', function (grid, selected, options) {
        console.log(selected);
    }, this);

    grid.on('itemclick', function (grid, record, item, index, e, options) {
        console.log('itemclick: ' + index);
    }, this);
});