Print Page - colorpicker in propertygrid

Title: colorpicker in propertygrid
Post by: JeroenNL on February 26, 2017, 03:30:52 AM

Hello,

I'm would like to have a colorpicker available as a row in a propertygrid. Is there a way to achieve this?

Cheers,
Jeroen

Title: Re: colorpicker in propertygrid
Post by: stworthy on February 27, 2017, 02:05:22 AM

Please download the simple color plugin from https://www.jeasyui.com/extension/downloads/jquery-easyui-color.zip

Title: Re: colorpicker in propertygrid
Post by: JeroenNL on March 05, 2017, 08:21:18 AM

Hey that's very nice! :)

But... how do I use this color box in a propertygrid? The example uses a class, while the propertygrid expects an editor property?

Title: Re: colorpicker in propertygrid
Post by: JeroenNL on March 10, 2017, 02:41:12 AM

Any clues?

Title: Re: colorpicker in propertygrid
Post by: stworthy on March 10, 2017, 07:56:17 AM

Please extend the 'color' editor as below:

Code:

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

And then apply the 'color' editor to the property row.

Code:

{"name":"Color","value":"#93c47d","group":"ID Settings","editor":"color"}

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: JeroenNL on February 26, 2017, 03:30:52 AM