2 Attachment(s)
[FIXED] [#1473] [4.2.0] ColorField does not use new value when the change was made in the RGB text fields
Hi,
There is an issue with the ColorField component, at least in Ext.Net 4.2: Selecting the color using the sliders and the 2D map works correctly, but using the text fields below the sliders doesn't. The picker will show the color correctly, but when clicking "OK" the change is not applied.
To reproduce:
1. Go to https://examples4.ext.net/#/ColorPic...nced/Overview/
2. Click on the color button (or the color field - both components have the same issue) - It should be red by default.
3. In the RGB text fields enter 0, 0, 255 - The picker will correctly show that blue is selected.
4. Click OK.
5. The button/field still remains red
Attachment 24938
If you drag one of the sliders a tiny bit after changing the fields the change will be applied correctly.
I've managed to trace the issue to how the "Ext.ux.colorpick.SelectorController" controller and the "Ext.ux.colorpick.Selection" viewmodel are wired up. The controller has an "initViewModel"-method which would wire up the "selectedColor" property to the view. However, this method is never called - "initViewModel" appears to be a method which should be called by the framework, but this doesn't happen (not sure why, my knowledge of Ext.js ViewModels is fairly limited).
For now we're using this override to fix this issue:
Code:
Ext.define(null, {
override: "Ext.ux.colorpick.Selector",
constructor: function() {
this.callParent(arguments);
this.controller.initViewModel();
}
});
There's also a second (but minor) issue: The color field displays the hex code of the selected color, but not the actual color like the button does:
Attachment 24937
We fixed this by using this CSS rule:
Code:
.x-colorpicker-field-swatch-inner {
z-index: 1;
}
Both issues reproduce in Chrome 57.0.2987.133, Firefox 53.0.2 and Internet Explorer 11.1066.14393.0.
