ext中的一些用法心得

CheckBoxAndRadio: function(){ 14. this.queryFieldForm = Ext.create("Ext.form.Panel",{ 15. id: 'checkBoxAndRadioForm' 16. ,name: 'checkBoxAndRadioForm' 17. ,margin: 1 18. ,region: 'north' 19. ,layout: "column" 20. ,tbar: [ 21. {xtype: 'button' 22. ,text: '輸出多選數據' 23. ,id: 'outputCheckBox' 24. }, 25. '-', 26. {xtype : 'button', 27. text : '輸出單選數據', 28. id : 'outputRadio' 29. }] 30. ,items:[ 31. {xtype:'checkboxgroup',name:'checkboxgroup', 32. id: 'checkboxgroup', fieldLabel: 'Two Columns',columnWidth:0.7, 33. items: [ 34. { boxLabel: 'Item 1', name: 'cb', inputValue: '1' }, 35. { boxLabel: 'Item 2', name: 'cb', inputValue: '2' }, 36. { boxLabel: 'Item 3', name: 'cb', inputValue: '3' }, 37. { boxLabel: 'Item 4', name: 'cb', inputValue: '4' }, 38. { boxLabel: 'Item 5', name: 'cb', inputValue: '5' }, 39. { boxLabel: 'Item 6', name: 'cb', inputValue: '6' } 40. ]} 41. ,{xtype:'radiogroup', name:'radiogroup', fieldLabel:'radios', 42. columnWidth:0.7,items: [ 43. { boxLabel: 'Item 1', name: 'rb', inputValue: '1' ,id: 'radiogroup'}, 44. { boxLabel: 'Item 2', name: 'rb', inputValue: '2' }, 45. { boxLabel: 'Item 3', name: 'rb', inputValue: '3' }, 46. { boxLabel: 'Item 4', name: 'rb', inputValue: '4' }, 47. { boxLabel: 'Item 5', name: 'rb', inputValue: '5' }, 48. { boxLabel: 'Item 6', name: 'rb', inputValue: '6' } 49. ]} 50. ] 51. }); viewConfig : { listeners : { scope : this, itemclick : function(view, record, item, index, e) { //雙擊事件~~~~alert(123);} }},原文出處:http://blog.csdn.net/zhangzhida163/article/details/7225005itemclick(Ext.view.View this, Ext.data.Model record, HTMLElement item, Number index, Ext.EventObject e ) //鼠標的單擊事件itemcontextmenu(Ext.view.View this, Ext.data.Model record, HTMLElement item, Number index, Ext.EventObject e ) //鼠標的右鍵事件itemdblclick(Ext.view.View this, Ext.data.Model record, HTMLElement item, Number index, Ext.EventObject e ) //鼠標的雙擊事件itemmousedown(Ext.view.View this, Ext.data.Model record, HTMLElement item, Number index, Ext.EventObject e ) itemmouseenter(Ext.view.View this, Ext.data.Model record, HTMLElement item, Number index, Ext.EventObject e )itemmouseleave(Ext.view.View this, Ext.data.Model record, HTMLElement item, Number index, Ext.EventObject e )itemmouseup(Ext.view.View this, Ext.data.Model record, HTMLElement item, Number index, Ext.EventObject e )添加時間的方法1.創建grid時添加var grid = Ext.create('Ext.grid.Panel', {renderto: Ext.getBody(), frame : true,store : store,layout : {type : 'hbox',align : 'stretch'},width : 500,heigh : 100,columns : [ {header : '名稱',flex : 1,sortable : true,dataIndex : 'NAME'}, {header : '路徑',flex : 1,sortable : true,dataIndex : 'PATH',hidden : true}, {header : '操作',flex : 1,sortable : true,dataIndex : 'ACTION'} ],listeners:{ 'itemclick':function(view,record,item,index,e){}},viewConfig : {forceFit : true,scrollOffset : 0}});2.後續添加grid.addListener('itemclick',click,this);function click(view,record,item,index,e){if (typeof (record.raw) != 'undefined') { name= record.raw.NAME; //獲取單擊行的相應數據 path= record.raw.PATH; num = index;}}combo 的用法// 獲取combox ID值var securityTypeIDValue = Ext.getCmp('securityTypeCombo').getValue(); // 獲取顯示值var securityTypeDisValue = Ext.getCmp('securityTypeCombo').getRawValue(); // Combox定義/***************************Combox start*******************************/var securityTypeRecord=[ {name : 'SAVE_VALUE',type : 'string'}, {name : 'DISPLAY_VALUE',type : 'string'} ]; var securityTypeRecordHeads = Ext.data.Record.create(securityTypeRecord); var securityTypeDatastore = new Ext.data.Store( { proxy:new Ext.data.HttpProxy(new Ext.data.Connection({timeout:0,url:'/customize/control/getZhengShangsecurityType'})), reader : new Ext.data.JsonReader( { root : 'root' }, securityTypeRecordHeads), remoteSort : false }); securityTypeDatastore.load();var securityTypeCombo = new Ext.form.ComboBox({id:'securityTypeCombo',width:110,forceSelection : true, selectOnFocus: true, triggerAction: 'all', mode: 'local', store: securityTypeDatastore, allowBlank: true, valueField : 'SAVE_VALUE', displayField : 'DISPLAY_VALUE',emptyText:'---請選擇---'});/***************************Combox end *******************************/