让Extjs EditorGridPanel 编辑时支持方向键
2013-08-27 12:18
459 查看
在用 extjs editorgridpanel 进行输入编辑的时候, 默认情况下只支持使用 tab 键可以实现焦点切换, 如果想让editorgridpanel 在编辑时通过方向键来实现焦点跳转切换,只需加上以下代码:
注意:这里重写的是:CellSelectionModel ,而不是RowSelectionModel
//让grid支持方向键盘 by liongis@163.com Ext.override(Ext.grid.CellSelectionModel, { onEditorKey : function(field, e) { var smodel = this; var k = e.getKey(), newCell, g = smodel.grid, ed = g.activeEditor; switch(k){ case e.TAB: e.stopEvent(); ed.completeEdit(); if (e.shiftKey) { newCell = g.walkCells(ed.row, ed.col-1, -1, smodel.acceptsNav, smodel); } else { newCell = g.walkCells(ed.row, ed.col+1, 1, smodel.acceptsNav, smodel); } if (ed.col == 1) { if (e.shiftKey) { newCell = g.walkCells(ed.row, ed.col+1, -1, smodel.acceptsNav, smodel); } else { newCell = g.walkCells(ed.row, ed.col+1, 1, smodel.acceptsNav, smodel); } } break; case e.UP: e.stopEvent(); ed.completeEdit(); newCell = g.walkCells(ed.row-1, ed.col, -1, smodel.acceptsNav, smodel); break; case e.DOWN: e.stopEvent(); ed.completeEdit(); newCell = g.walkCells(ed.row+1, ed.col, 1, smodel.acceptsNav, smodel); break; case e.LEFT: e.stopEvent(); ed.completeEdit(); newCell = g.walkCells(ed.row, ed.col-1, -1, smodel.acceptsNav, smodel); break; case e.RIGHT: e.stopEvent(); ed.completeEdit(); newCell = g.walkCells(ed.row, ed.col+1, 1, smodel.acceptsNav, smodel); break; } if (newCell) { g.startEditing(newCell[0], newCell[1]); } } });
注意:这里重写的是:CellSelectionModel ,而不是RowSelectionModel
相关文章推荐
- ExtJS EditorGridPanel中时间日期编辑问题的总结
- ExtJS学习(四)EditorGrid可编辑表格
- Extjs editorgridpanel combox 显示数据问题
- ExtJS EditorGridPanel 示例之JSON格式Store前后台增删改查
- Extjs EditorGridPanel中ComboBox列的显示问题
- ExtJS EditorGridPanel 示例之xml格式Store前后台增删改查
- Ext.grid.EditorGridPanel联动设置单元格是否可以编辑和背景色
- ExtJS EditorGridPanel 示例之xml格式Store前后台增删改查
- 解决editorgridpanel编辑时视图向右移动的问题
- 2012/7/26Extjs笔记_Ext.grid.EditorGridPanel
- ExtJS EditorGridPanel 示例之JSON格式Store前后台增删改查
- Extjs EditorGridPanel中ComboBox列的显示问题
- Extjs EditorGridPanel中ComboBox列的显示问题(默认显示键而不是值)
- 可编辑的EditorGridPanel
- ExtJS EditorGridPanel 示例之Array格式(自定义Array解析器)Store前后台增删改查
- extjs EditorGridPanel
- Extjs EditorGridPanel
- 关于Extjs3.0中的TreeGrid(Ext.ux.maximgb.tg.EditorGridPanel)
- ExtJS EditorGridPanel 示例之Array格式(自定义Array解析器)Store前后台增删改查
- 修正Ext.grid.EditorGridPanel 编辑时 右移bug