Select event on ColorMenu

[joaosobrinho]

Hello.

I'm trying to create a colormenu and create an event when someone selects one color.

the code is the following:

var colormenu = new Ext.menu.ColorMenu();
				colormenu.palette.colors = ["c6d9f1","f2dbdb","ddd9c3","fbd4b4","eaf1dd","dbe5f1","deb3b3","fff0c3","daeef3","fbcb90","c0c0cd","d7f297","ffb8d4","ffdc66","4edab2","9dedbb","ffa58a","fd77b4","e1d1c6","fffaaf"];
				colormenu.on('select',function(colorpalette, color){
					alert(color);
				});

				var tb = new Ext.Toolbar('escolher_cor');
				tb.add({
			        cls: 'x-btn-text bmenu', // icon and text class
			        text:'Escolher Cor',
			    	menu: colormenu
			    });

it is all rendering well, but when I select one color, nothing happens.

i get this on firebug:

B.child("a.color-" + A) is null
[Break on this error] Ext.ColorPalette=function(A){Ext.ColorPa...e=A;this.fireEvent("select",this,A)}}});

at ext-all.js (linha 63)

if i remove the second line of the code, where I define the colorpalette, it works!
but i need to define it. is there any other way to do it in order to keep the select event working ?

anyone can help me on this ?

[joaosobrinho]

i tryed to create a ColorPalette and assign it to ColorMenu.palette property, but it doesn't work... the palette isn't assigned.

can anyone help me ?


edit:

i used the debug file to check the exact line where i get the error and it is the line number 13666:

el.child("a.color-"+color).addClass("x-color-palette-sel");

[mrspock73]

Is there a solution of this problem? I got exactly the same behaviour with extJS2 :-(

[Condor]

You can't set the palette after the ColorPicker is created (it isn't a writable property!).

Use:

var colormenu = new Ext.menu.ColorMenu({
	colors: [
		"c6d9f1","f2dbdb","ddd9c3","fbd4b4",
		"eaf1dd","dbe5f1","deb3b3","fff0c3",
		"daeef3","fbcb90","c0c0cd","d7f297",
		"ffb8d4","ffdc66","4edab2","9dedbb",
		"ffa58a","fd77b4","e1d1c6","fffaaf"
	]
});

[mrspock73]

Thank you for the quick reply. But this doesnt work also:

var ZitatColorMenu = new Ext.menu.ColorMenu({
colors: [
"c6d9f1","f2dbdb","ddd9c3","fbd4b4",
"eaf1dd","dbe5f1","deb3b3","fff0c3",
"daeef3","fbcb90","c0c0cd","d7f297",
"ffb8d4","ffdc66","4edab2","9dedbb",
"ffa58a","fd77b4","e1d1c6","fffaaf"
]
});

var ZitatMenu = new Ext.menu.Menu({
id: 'imageMenu',
items: [
{
text: 'Zitat löschen',
handler: function(){
...
} /* End of handler */
},
{
text:'Farbe',
menu:ZitatColorMenu
},
]
});

Its the same Error: "b.child("a.color-"+a) is null"

[Condor]

It does work, but you need to use uppercase colors:

var ZitatColorMenu = new Ext.menu.ColorMenu({
	colors: [
		"C6D9F1","F2DBDB","DDD9C3","FBD4B4",
		"EAF1DD","DBE5F1","DEB3B3","FFF0C3",
		"DAEEF3","FBCB90","C0C0CD","D7F297",
		"FFB8D4","FFDC66","4EDAB2","9DEDBB",
		"FFA58A","FD77B4","E1D1C6","FFFAAF"
	]
});

[Evanwukong]

I encountered this problem when I used ColorPalette in EXTJS 3.1.Finally I found that I assigned an wrong value to the value property .Here is my code:
var cp = new Ext.ColorPalette({
value: '993300'
,renderTo: 'pa'
});
cp.on('select', function(p,v){
Ext.Msg.alert('INFO',v);
});
You can try this format.
I used '336633' as the initial value of the value property so Firebug showed the same error as yours.