向ext的form表單元素添加click監聽事件

首先有這麼一個form。

authform = new Ext.form.FormPanel({
		id:'authform',
		xtype:'form',
		url:fullpath+'/esb/EsbServiceAuthAction!authApply.do' ,
 		baseCls:"x-plain",
		style:"padding:5px",
		items:[{
	          	xtype:'textarea',fieldLabel:'申請理由', id:'applyreason',
	          	height:90,anchor:'98%',readOnly:true,style:'background:#E6E6F1;'
	    	},{
	        	xtype: "textfield",fieldLabel: "申請生效時間",id:'apply_time',
        		anchor:'98%',readOnly:true,style:'background:#E6E6F1;'
		 	},{
	        	xtype: "textfield",fieldLabel: "申請開通有效期",id:'apply_times',
        		anchor:'98%',readOnly:true,style:'background:#E6E6F1;'
		 	},{
		 		xtype : 'combo',fieldLabel:'審覈開通有效期', id:'reply_times',
		  		store : new Ext.data.SimpleStore({  
		  			data: [['一個月','1'],['三個月','2'],['半年','3'],['一年','4'],['長期有效','99']],  
		   			fields:['text', 'value']  
		  		}),  
		  		displayField:'text', valueField:'value',  
	  			mode : 'local', editable : false,  
		  		triggerAction:'all',  
		  		anchor:'98%',emptyText:'請選擇'  
		 	},{
	          	xtype:'textfield',fieldLabel:'申請開通IP', id:'apply_ip',
	          	anchor:'98%'
	      	},{
	          	xtype:'textfield',fieldLabel:'SP號碼', id:'sp_id',
	          	anchor:'98%',readOnly:true,allowBlank:false,emptyText:'點擊生成號碼',
	          	listeners:{render:function(p){Ext.getCmp('sp_id').getEl().on('click', setSpID); }}
	      	},{
		xtype : 'combo',fieldLabel:'具備權限', id:'apply_status',
		store : new Ext.data.SimpleStore({  
		data: [['通過','agree'],['拒絕','rejected']],  
		fields:['text', 'value']  
		}),  
		displayField:'text', valueField:'value',  
	  	mode : 'local', editable : false,  
		triggerAction:'all',  
		anchor:'98%',emptyText:'請選擇',allowBlank:false
}
        ],
        buttons: [{
			   text: '確定',
			   type:'button',
			   id:'login',
			   handler:function(){textarea
			   		if( authform.getForm().isValid()) {
		   				authform.getForm().submit({
     		  		  		waitTitle:"等待中.....",
     		 		   		waitMsg:"正在提交數據，請稍.....",
     		 		   		failure:function(){
     		 		   	        Ext.Msg.alert('信息', ' 操作失敗，請檢查服務器!');   
     		 		   		authwin.hide();
			   		},
     		 		   		success:function(_form,_action){
     		 		   	    	Ext.Msg.alert('信息', '發佈成功!');
     		 		   	      	authwin.hide();
			   		        store.load({params:{start:0, limit:20}});
     		 	 	   		}
     	 	 			});
                  	}
		   		}
			},{
			   text: '取消',
			   type:'button',
			   id:'clear',
			   handler: function(){authwin.hide();}
	   		}
		]
	});

可以看到form表單裏面有多種元素，包括textfield、textarea、combo，其中在“SP號碼”這裏寫click響應事件，該listener如下：

listeners:{render:function(p){Ext.getCmp('sp_id').getEl().on('click', setSpID); }}（見上述代碼），click時，響應事件爲函數setSpID，該函數如下。

function setSpID(){	//生成隨機數（sp號碼）
	if(authform.getForm().findField('apply_status').getValue()=='agree'){
		 Ext.MessageBox.alert('提示','操作失敗，上一次操作已生成了有效SP號碼'); 
		 return;
	}
	var randNum = new Date().getTime()+""+ Math.floor(Math.random()*100000);
	Ext.MessageBox.confirm('信息確認', '單擊確認將生成新的SP號碼', function(e){
if(e=='yes') Ext.getCmp('sp_id').setValue(randNum);
});
}

其中，重點是這個執行語句：Ext.getCmp('sp_id').setValue(randNum);//這樣就能向“SP號碼”表單項設入隨機數了，其他語句可以忽略。

當然，稍稍用另一種風格寫listener，也是可以的，如下：

listeners:{
'render':function(){
Ext.EventManager.on("sp_id", 'click', function(){
	              alert("test");
	          })
	 }
}

combo組建的監聽器可以稍稍參考：

listeners:{'select':function(){Ext.getCmp('xxxid1').setValue(Ext.getCmp('xxxid1').getValue());}}