I need to add a colour picker as a admin form field - I have added what I believe is needed to get the JS working but it's still throwing errors and showing me no form field. The color picker I'm trying to use is: http://www.jar2.net/projects/jquery-wheelcolorpicker
I have declared my form field like:
<field name="colour">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="component" xsi:type="string">Vendor_Module/js/form/element/color-select</item>
<item name="template" xsi:type="string">ui/form/field</item>
<item name="elementTmpl" xsi:type="string">Vendor_Module/form/element/color-select</item>
<item name="label" xsi:type="string">Colour</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">roundel</item>
</item>
</argument>
</field>
The JS form element file looks like:
require(['jquery','colorwheel'],function($){
$(window).load(function() {
$('#color-wheel-picker').wheelColorPicker();
});
});
The colorwheelpicker minified JS file is in the same directory as the above file. I can see it being added to the head OK.
And I have declared my require config like this and its just sitting in Vendor/Module/view/adminhtml:
var config = {
map: {
'*': {
colorwheel: 'Lewis_Roundel/js/form/element/jquery.wheelcolorpicker-3.0.2.min'
}
}
};
But when I rebuild the admin theme, I received this error and no form field at all, let alone a color wheel:
Anyone have any ideas? My JS knowledge is not up to scratch!