如何在 Ext JS 3 网格中捕获 Tab 按键事件答案

【问题标题】：How to catch Tab key press event in Ext JS 3 grid如何在 Ext JS 3 网格中捕获 Tab 按键事件
【发布时间】：2014-05-31 05:19:15
【问题描述】：

我试图捕捉 Tab 按键事件。这是我尝试过的：

this.test.on('keypress', function(t,e) {
    if (e.getKey() == Ext.EventObject.ENTER) {
        alet('kk');
    }
}, this);

请帮助捕捉网格单元格中的 Tab 按键事件。

This my EditorGridPanel override function

         Ext.override(Ext.grid.EditorGridPanel, {
            initEvents : function(){
               Ext.grid.EditorGridPanel.superclass.initEvents.call(this);
               this.on("bodyscroll", this.stopEditing, this, [true]);
               this.on("columnresize", this.stopEditing, this, [true]);
               this.view.scroller.on("mousedown", this.onMouseDownEditClick, this);

               this.on('keypress', function(t,e) {
//                  if (e.getKey() == Ext.EventObject.TAB) {
                      alert('kk');
//                  }
               }, this);                

               //Reload datastore without redrawing grid
               this.getView().on('beforerefresh', function(view) {
                 view.scrollTop = view.scroller.dom.scrollTop;
                 view.scrollHeight = view.scroller.dom.scrollHeight;
               });
               this.getView().on('refresh', function(view) {
                   setTimeout(function () {
                       view.scroller.dom.scrollTop = view.scrollTop + (view.scrollTop == 0 ? 0 : view.scroller.dom.scrollHeight - view.scrollHeight);
                   }, 100);
               });

                if(this.clicksToEdit == 'mousedown'){
                    this.view.scroller.on("mousedown", this.onMouseDownEditClick, this);
                }else   if(this.clicksToEdit == 1){
                    this.on("cellclick", this.onCellDblClick, this);
                }else {
                    if(this.clicksToEdit == 'auto' && this.view.mainBody){
                        this.view.mainBody.on("mousedown", this.onAutoEditClick, this);
                    }
                    this.on("celldblclick", this.onCellDblClick, this);
                }
            },
            onMouseDownEditClick : function(e, t){
               if(e.button !== 0){
                  return;
               }
               var row = this.view.findRowIndex(t);
               var col = this.view.findCellIndex(t);
               edit_row = row;
               edit_col = col;
               if(row !== false && col !== false){
                  this.startEditing(row, col);
               }
            }

         });

【问题讨论】：

标签： extjs extjs3

【解决方案1】：

我在您的代码中看到了拼写错误。而是

alet('kk');

使用

alert('kk');

但无论如何，您是否尝试过使用类似的东西？

this.test.on('keypress', function(t,e) {
   if (e.getKey() == Ext.EventObject.TAB) {
       alert('kk');
   }
}, this);

【讨论】：

感谢您的反馈，实际上我正在尝试使用警报，但这并没有给我任何警报。但我覆盖了EditerGridPanel，以便在我的网格中单击编辑启用。现在我用那个代码编辑我的问题

【解决方案2】：

我遇到了类似的问题，因为“keypress”事件仅在事件发生在 EditorGridPanel（而不是单个单元格）上时触发。

我将事件侦听器放在 EditorGridPanel 的 GridView 上，特别是为了我侦听“rowupdated”事件 (http://docs.sencha.com/extjs/3.4.0/#!/api/Ext.grid.GridView-event-rowupdated) - 我希望这对其他人有所帮助。

【讨论】：