如何使用keymap使enter键实现tab键的功能
liuboluck_1985
2008-06-30
初学extjs,现在正在做demo。问题是:可以直接使用tab键 在editgridpanel中进行导航但是经理让我把tab键的页面导航功能改成使用enter键来实现。搞得我是一头雾水,做了很久了还是没有解决。。。。。。。
还有就是,在使用editgridpanel时候,当ColumnModel中的一个字段定义为editor:new Ext.form.TextField时候,当点击触发edit事件时,只是焦点在这个TextField中,还要双击TextField才能选中字段内容,所以想问问能不能使字段内容选中呢? 麻烦大家了,谢谢大家给我答复 o(∩_∩)o... 代码如下: Ext.onReady(function(){ Ext.BLANK_IMAGE_URL = 'js/s.gif'; var checkColumn = new Ext.grid.CheckColumn({ header: "DEAD", dataIndex: 'dead', width: 55, editor:new Ext.form.Checkbox() }); var sm = new Ext.grid.CheckboxSelectionModel(); var cm = new Ext.grid.ColumnModel([ new Ext.grid.RowNumberer(), sm, //引进定义的选择列表框 { id:'id', header:'ID', dataIndex:'id', sortable:true, width: 80, editor:new Ext.form.TextField({ allowBlank: false }) },{ header:'sex', dataIndex:'sex', width: 80, editor:new Ext.form.ComboBox({ transform:"sex1", triggerAction: 'all', lazyRender:true }) },{ header:'name', width: 80, dataIndex:'name' },{ header:'birthday', dataIndex:'birthday', width: 80, renderer:Ext.util.Format.dateRenderer("Y-m-d"), editor: new Ext.form.DateField({ format: "Y-m-d", minValue: '2008-1-1', disabledDays: [0, 6] }) }, checkColumn , {header:'连接', width: 80, dataIndex:'lianjie', renderer:function(value){ return "<a href='index.jsp' target='mainFrame'>"+value+"</a>" } } ]); cm.defaultSortable = true; var Plant = Ext.data.Record.create([ {name: 'id', type: 'int'}, {name: 'sex', type: 'string'}, {name: 'name'}, {name: "birthday",mapping: 'birthday', type: 'date', dateFormat: "Y-m-d"}, {name: 'dead', type: 'bool'}, {name: 'lianjie'} ]); var ds = new Ext.data.GroupingStore({ proxy: new Ext.data.HttpProxy({url:'seegird.action'}), reader: new Ext.data.JsonReader({ totalProperty: 'total', root: 'GridModle', successProperty :'success' }, Plant ) , sortInfo:{field:'id', direction:'ASC'}, groupField:'sex' }); var grid = new Ext.grid.EditorGridPanel({ el:"grid", ds: ds, sm: sm, cm: cm, width:100, height:200, collapsible: true, animCollapse: false, region:'center', frame:true, autoExpandColumn:'id', plugins:checkColumn, clicksToEdit:1, trackMouseOver:false, loadMask: {msg:'正在加载数据,请稍侯……'}, view: new Ext.grid.GroupingView({ forceFit:true, groupTextTpl: 'hello({[values.rs.length]} {[values.rs.length > 1 ? "Items" : "Item"]})' }), tbar: [new Ext.Toolbar.Fill(), new Ext.DownLoad()], bbar: new Ext.PagingToolbar({ pageSize: 20, store: ds, displayInfo: true, displayMsg: '第{0} 到 {1} 条数据 共{2}条', emptyMsg: "没有数据" }) }); ds.load({params:{start:0, limit:20}}); var viewport = new Ext.Viewport({ layout:'border', items:[grid ] }); viewport.render(); var el =Ext.get(grid); var map = new Ext.KeyMap(el, { key: 13, // or Ext.EventObject.ENTER fn: function(){return Ext.EventObject.TAB} }); }); Ext.grid.CheckColumn = function(config){ Ext.apply(this, config); if(!this.id){ this.id = Ext.id(); } this.renderer = this.renderer.createDelegate(this); }; Ext.grid.CheckColumn.prototype ={ init : function(grid){ this.grid = grid; this.grid.on('render', function(){ var view = this.grid.getView(); view.mainBody.on('mousedown', this.onMouseDown, this); }, this); }, onMouseDown : function(e, t){ if(t.className && t.className.indexOf('x-grid3-cc-'+this.id) != -1){ e.stopEvent(); var index = this.grid.getView().findRowIndex(t); var record = this.grid.store.getAt(index); record.set(this.dataIndex, !record.data[this.dataIndex]); } }, renderer : function(v, p, record){ p.css += ' x-grid3-check-col-td'; return '<div class="x-grid3-check-col'+(v?'-on':'')+' x-grid3-cc-'+this.id+'"> </div>'; } }; |
|
htt6310753
2011-09-11
兄弟这个问题解决了吗???我也正在急需啊 !!忘兄回复一下
|