Ext 颜色选择器使用

直接上代码：

Ext.onReady( function() {
		var colorShowId = '';
		var colorWin = new Ext.Window( {
			border :0,
			frame:false,
			closeAction :'hide',
			closable :false,
			resizable :false,
			width :100,
			height :80,
			items : [ 
			          {
			        	  xtype:'colorpicker',
			        	  listeners: {
			        	        select: function(picker, selColor) {
						        	  var color = '#' + selColor;
						  			// alert(colorShowId+','+color);
						  				Ext.getDom(colorShowId).style.background = color;
						  				colorWin.hide(); 
			        	        }
			        	    }
			          }
			 ]
		}) ;
		function showColor(id) {
			colorShowId = id;
			var colorText = Ext.getCmp(id);
			colorWin.x = colorText.getPosition()[0] + colorText.getWidth();
			colorWin.y = colorText.getPosition()[1];
			colorWin.show();
		}
		 
		var form = Ext.create('Ext.form.Panel',{ 
			width:200,
			buttons: [{
		        text: '',
		        id:'bb',
		        style:'background:red',
		        handler: function(btn) {
					showColor('bb');
		        }
		    } ],
			renderTo:Ext.getBody()
		}); 
		 
	})

一：定义form，form里面有个button，button的click方法显示颜色选择器
二：颜色选择器放在window里
三：选择颜色后改变button的背景色