[SOLVED] ext color in ext edatagrid

[Coder]

Can I use color extension ion edatagrid editor?

Code:

<table id="dgType" title="types" class="easyui-edatagrid"
	width="300px" fit="true" pagination="false"
        toolbar="#dgTypeToolbar"
	idField="ID" sortName="Weight,Name" sortOrder="asc,asc"
        rownumbers="true" fitColumns="true" singleSelect="true"
	data-options="url: '?Type=l'
		 ,saveUrl: '?Type=I'
		 ,updateUrl: '?Type=U'
		 ,destroyUrl: '?Type=d'
		"
	>
  <thead>
	<tr>
		<th field="ID"		hidden="true"></th>
		...
		<th field="Active" 	width="05%" 	editor="{type:'checkbox',options:{required:true,value:'1',on:'1',off:'0'}}">Active</th>
		<th field="colorBG"	width="10%" 	editor="{type:'color',options:{required:true}}">background</th>
		<th field="colorT"	width="10%" 	editor="{type:'color',options:{required:true}}">text</th>
	</tr>
 </thead>
</table>

column colorT and colorBG didnt editable

Code:

<input class="easyui-color">

- work fine

[stworthy]

Please extend the 'color' editor on the datagrid.

Code:

<script type="text/javascript">
$.extend($.fn.datagrid.defaults.editors, {
	color: {
		init: function(container, options){
			var input = $('<input class="datagrid-editable-input">').appendTo(container);
			input.color(options)
			return input;
		},
		getValue: function(target){
			return $(target).color('getValue');
		},
		setValue: function(target, value){
			$(target).color('setValue',value);
		},
		resize: function(target, width){
			$(target)._outerWidth(width);
		}
	}
})
</script>

[Coder]

Thnx!