Skip to Content
Menu
This question has been flagged
1 Reply
3356 Views

Hey everyone,


I am trying to understand Javascript in Odoo 11 because I want to colorize the Kanban cards based on a field holding rgba values.


I have gotten this far:


odoo.define('project_show_milestone.kanban_milestone_color', function(require){
"use strict";
var KanbanRecord = require('web.KanbanRecord');

KanbanRecord.include({       
    renderElement: function () {
        this._super.apply(this, arguments);
        if (this.recordData['ms_color'] != false) {
            //Apply the color to the record, if there is one.          
            this.$el.find('.oe_kanban_card').css("background-color", this.recordData['ms_color'] || 'green');        
            var core = require('web.core');                         alert(core._t(this.recordData['ms_color']));
         }
     }   
   });
});

The alert message, showing the field value executes fine, but the background-color is not applied.

I have no idea why...?

Could you please help me out.


Thanks in advance.

Edited for readability.

Avatar
Discard
Best Answer

Hello Fel,


You have did everything correct appart from 1 mistake that is specifying what type of color you are using: ie. rgb, rgba, hex.


Please change this part:


---this.$el.find('.oe_kanban_card').css("background-color", this.recordData['ms_color'] || 'green');


to:


---this.$el.find('.oe_kanban_card').css("background-color", "rgb("+this.recordData['ms_color']+")" || 'green');



so that the final output will be: rgb(0,255,0) or green


Hope it helps.

Regards,




Email:      odoo@aktivsoftware.com  

Skype: kalpeshmaheshwari

   

Avatar
Discard
Author

Dear Jainesh,

thank you for getting back to me. Apparently there must be some overlay or css interference. I could colorize parts of the Kanban tile using your approach but never the whole thing.

So the Javascript ist find and all but there must be more going on with the CSS.

I chose to put an icon in the instead, changing the color using javascript.

Related Posts Replies Views Activity
0
Jan 21
1867
2
Mar 16
4789
2
Jul 23
1504
1
Oct 22
21679
1
Jul 22
1457