Change Background based on value

I’m trying to use this code to update the background of a field but nothing seems to happen. I’m obviously missing something but I have tried all the version I can think of. I just need this calculated field on the display form to be red if the value is greater than 6.

fd.spRendered(function() {
if (fd.field(‘Total_x0020_items’).value > 6){
fd.field(‘Total_x0020_items’).attr(‘style’,‘background:red’)
}
});

Hi!

Please try to use this code:

fd.spRendered(function() {
    if (fd.field('Total_x0020_items').value > 6){
        $(fd.field('Total_x0020_items').$el).find('input').css('background-color','red');
    }
});

No luck. I'm not sure what I'm missing. It's almost like the Javascript isn't working at all. I tried to just set the color and that doesn't work. I'm just putting it in using the Javascript button in the ribbon.

Hi!

Please try to paste my code without formatting, your single quotes aren’t the right one.

Hi @AlexZver I'm not able to get this working.

I want to change the background color to red if the value = 'Urgent'

fd.spRendered(function() {
if (fd.field('Priority').value == 'Urgent'){
$(fd.field('Priority').$el).find('input').css('background-color','red');
}
});

Hello @ParAvion,

What is the type of Priority field? Is it a Choice field?

If so, please use the following code:

$(fd.field('Priority').$el).find('span.k-dropdown-wrap.k-state-default').css('background-color','red');

@mnikitina I am having trouble but am basing the formatting on a Yes/No field
fd.spRendered(function() {
if (fd.field('America_x0027_s_x0020_PPO_x0020_10').value == true){
$(fd.field('America_x0027_s_x0020_PPO_x0020_10').$el).find('input').css('background-color','red');
}
});
Do I need something different?

Hello @JohnnyThunder,

Welcome to Plumsail community!

You can change the background of the turned on toggle using the CSS:

.k-switch-on .k-switch-container {
    background-color: red !important;
}