Change color of CSS Class depending on a Value from Field

[eterrazas]

Hi, I want to change the background of a GRID i assing a name in the Class section of the grid called status.

function changeStatusColor() {
console.log(fd.field('Status').value);
if(fd.field('Status').value == 'Rejected'){
$(fd.field('Status').$el).css('background-color', 'red')
}
else {
$(fd.field('Status').$el).css('background-color', 'yellow')
}
}

fd.rendered(function () {
//сalling the function on form load
changeStatusColor();

//Call the function when the field value changes
fd.field('Status').$on('change', changeStatusColor);

});

My status are:
Rejected > Red
Approved > Blue
Pending for execution > Orange
Completed > Green

[Nikita_Kurguzov]

Dear @eterrazas,
You can give the Class to the whole cell in the editor:

Then use it to set the color:

$('.field-cell').attr('style', 'background:red;');

[eterrazas]

@Nikita_Kurguzov

$('.field-cell').attr('style', 'background:red;');

Thanks for your help