zoukankan      html  css  js  c++  java
  • 让Extjs EditorGridPanel 编辑时支持方向键

    在用 extjs editorgridpanel 进行输入编辑的时候, 默认情况下只支持使用 tab 键可以实现焦点切换, 如果想让editorgridpanel 在编辑时通过方向键来实现焦点跳转切换,只需加上以下代码:

    //让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

  • 相关阅读:
    揭秘Amazon反应速度超快的下拉菜单
    CSS3滤镜
    雅虎团队经验:网站页面性能优化的34条黄金守则
    10条影响CSS渲染速度的写法与建议
    前端优秀网站
    视频媒体播放,最好的 HTML 解决方法
    zen-coding for notepad++,前端最佳手写代码编辑器
    ASP.NET中IsPostBack详解
    w3c教程
    怎样才能成为优秀的前端开发工程师
  • 原文地址:https://www.cnblogs.com/liongis/p/3284620.html
Copyright © 2011-2022 走看看