海水正蓝

面朝大海,春暖花开
posts - 145, comments - 29, trackbacks - 0, articles - 1
  BlogJava :: 首页 :: 新随笔 :: 联系 :: 聚合  :: 管理

【转】Extjs学习总结---Ext.Grid回车控制

Posted on 2012-12-06 23:14 小胡子 阅读(2205) 评论(0)  编辑  收藏 所属分类: Ext
原先的EditGrid无法解决回车控制问题,它的回车控制是向下跑的。而我想让它横着走。搞了半天终于实现了。

 1 Ext.override(Ext.grid.RowSelectionModel, {
 2                 onEditorKey : function(field, e) {
 3                     // alert('go');
 4                     var k = e.getKey(), newCell, g = this.grid, ed = g.activeEditor;
 5                     var shift = e.shiftKey;
 6                     Ext.log('k:' + k);
 7                     if (k == e.ENTER) {
 8                         e.stopEvent();
 9                         ed.completeEdit();
10                         if (shift) {
11                             newCell = g.walkCells(ed.row, ed.col - 1-1,
12                                     this.acceptsNav, this);
13                         } else {
14                             // alert('go');
15                             newCell = g.walkCells(ed.row, ed.col + 11,
16                                     this.acceptsNav, this);
17                         }
18                     } else if (k == e.TAB) {
19                         e.stopEvent();
20                         ed.completeEdit();
21                         if (this.moveEditorOnEnter !== false) {
22                             if (shift) {
23                                 newCell = g.walkCells(ed.row - 1, ed.col, -1,
24                                         this.acceptsNav, this);
25                             } else {
26                                 // alert('go');
27                                 newCell = g.walkCells(ed.row + 1, ed.col, 1,
28                                         this.acceptsNav, this);
29                             }
30                         }
31                     } else if (k == e.ESC) {
32                         ed.cancelEdit();
33                     }
34                     if (newCell) {
35                         g.startEditing(newCell[0], newCell[1]);
36                     }
37                 }
38             });
39     var sm2 = new Ext.grid.RowSelectionModel({
40         moveEditorOnEnter : true,
41         singleSelect : true,
42         listeners : {
43             rowselect : function(sm, row, rec) {
44                 centerForm.getForm().loadRecord(rec);
45             }
46         }
47 
48     });

原文出自:
http://erichua.iteye.com/blog/234698

2.

默认extjs中editorgrid编辑单元格的时候按回车是将焦点向下移动,按照一般的逻辑应该是向右移动。

其实只要将原先rowSelectionModel中onEditorKey方法override一下即可。

代码如下:


 1 Ext.override(Ext.grid.RowSelectionModel, {
 2 
 3  onEditorKey : function(field, e) {
 4   var k = e.getKey(), newCell, g = this.grid, last = g.lastEdit, ed = g.activeEditor, shift = e.shiftKey, ae, last, r, c;
 5 
 6   if (k == e.TAB) {
 7    e.stopEvent();
 8    ed.completeEdit();
 9    if (shift) {
10     newCell = g.walkCells(ed.row, ed.col - 1-1this.acceptsNav,
11       this);
12    } else {
13     newCell = g.walkCells(ed.row, ed.col + 11this.acceptsNav,
14       this);
15    }
16   } else if (k == e.ENTER) {
17    if (this.moveEditorOnEnter !== false) {
18     if (shift) {
19      newCell = g.walkCells(last.row, last.col - 1-1,
20        this.acceptsNav, this);
21     } else {
22      newCell = g.walkCells(last.row, last.col + 11,
23        this.acceptsNav, this);
24     }
25    }
26   }
27   if (newCell) {
28    r = newCell[0];
29    c = newCell[1];
30 
31    this.onEditorSelect(r, last.row);
32 
33    if (g.isEditor && g.editing) { // *** handle tabbing while
34            // editorgrid is in edit mode
35     ae = g.activeEditor;
36     if (ae && ae.field.triggerBlur) {
37      // *** if activeEditor is a TriggerField, explicitly call
38      // its triggerBlur() method
39      ae.field.triggerBlur();
40     }
41    }
42    g.startEditing(r, c);
43   }
44  }
45 })

 


只有注册用户登录后才能发表评论。


网站导航: