I need help.

I am developing a new widget in javascript to render a label (badge) with a specified color. Like the case of many2many_tags widget but only for Many2one fields. (I need to show categories with a user defined color)

I need to get the value of color field in javascript (I'm passing color field name in widget options).

XML

Javascript

_______________________________________________________________________

odoo.define("web_widget_badgecolored", function (require) {
"use strict";

var AbstractField = require('web.AbstractField');
var fieldRegistry = require('web.field_registry');

var core = require('web.core');

var qweb = core.qweb;

var FieldM2OBadgeColored = AbstractField.extend({

supportedFieldTypes: ['many2one'],

_init: function() {
this._super.apply(this, arguments);
},

_render: function () {

this.ColorField = this.nodeOptions.color_field || this.field.color_field || 'color';
console.log(this.value)
this.$el.addClass('badge badgecolored odoo-color-' + this.ColorField).text(this._formatValue(this.value));
},

});

fieldRegistry.add('m2o_badgecolored', FieldM2OBadgeColored);

return {
FieldM2OBadgeColored: FieldM2OBadgeColored,
};

});

--------------------------------------------------------------------------

I  browser I get the name of field but not the value of the field color:

but I need something like:

or