Hello @SimranK93838843
1. If you use Column/Field Style then it is only applicable for List view.
2. If you want the column background color something like below then you need to use onLoad Client script
I am sharing basic vs advance client script code for your reference as either will work:
Below is basic Javascript
function onLoad() {
//Type appropriate comment here, and begin script below
var riskControl = g_form.getControl('u_risk');
var impactControl = g_form.getControl('u_impact');
var fieldRisk = g_form.getValue('u_risk');
var fieldImpact = g_form.getValue('u_impact');
// Specific condition: Risk = High, Impact = Low
if (fieldRisk == 'High' && fieldImpact == 'Low') {
//riskControl.style.color = 'red'; // to set the color of field value or font
riskControl.style.backgroundColor = 'red'; // to set the background color of the risk field
impactControl.style.backgroundColor = 'green';
}
// Specific condition: Risk = High, Impact = Moderate
else if (fieldRisk == 'High' && fieldImpact == 'Moderate') {
riskControl.style.backgroundColor = 'red'; // to set the background color of the risk field
impactControl.style.backgroundColor = 'yellow';
}
// Specific condition: Risk = Moderate, Impact = High
if (fieldRisk == 'Moderate' && fieldImpact == 'High') {
riskControl.style.backgroundColor = 'yellow'; // to set the background color of the risk field
impactControl.style.backgroundColor = 'red';
}
// Specific condition: Risk = High, Impact = Low
else if (fieldRisk == 'Moderate' && fieldImpact == 'Low') {
riskControl.style.backgroundColor = 'yellow'; // to set the background color of the risk field
impactControl.style.backgroundColor = 'green';
}
// Specific condition: Risk = Low, Impact = High
if (fieldRisk == 'Low' && fieldImpact == 'High') {
riskControl.style.backgroundColor = 'green'; // to set the background color of the risk field
impactControl.style.backgroundColor = 'red';
}
// Specific condition: Risk = Low, Impact = Moderate
else if (fieldRisk == 'Low' && fieldImpact == 'Moderate') {
riskControl.style.backgroundColor = 'green'; // to set the background color of the risk field
impactControl.style.backgroundColor = 'yellow';
}
// Specific condition: Impact = High, Risk = Moderate
if (fieldImpact == 'High' && fieldRisk == 'Moderate') {
impactControl.style.backgroundColor = 'red';
riskControl.style.backgroundColor = 'yellow'; // to set the background color of the risk field
}
// Specific condition: Impact = High, Risk = Low
else if (fieldImpact == 'High' && fieldRisk == 'low') {
impactControl.style.backgroundColor = 'red';
riskControl.style.backgroundColor = 'green'; // to set the background color of the risk field
}
// Specific condition: Impact = Moderate, Risk = High
if (fieldImpact == 'Moderate' && fieldRisk == 'High') {
impactControl.style.backgroundColor = 'yellow';
riskControl.style.backgroundColor = 'red'; // to set the background color of the risk field
}
// Specific condition: Impact = Moderate, Risk = Low
else if (fieldImpact == 'Moderate' && fieldRisk == 'Low') {
impactControl.style.backgroundColor = 'yellow';
riskControl.style.backgroundColor = 'green'; // to set the background color of the risk field
}
// Specific condition: Impact = Low, Risk = High
if (fieldImpact == 'Low' && fieldRisk == 'High') {
impactControl.style.backgroundColor = 'green';
riskControl.style.backgroundColor = 'red'; // to set the background color of the risk field
}
// Specific condition: Impact = Low, Risk = Moderate
else if (fieldImpact == 'Low' && fieldRisk == 'Moderate') {
impactControl.style.backgroundColor = 'green';
riskControl.style.backgroundColor = 'yellow'; // to set the background color of the risk field
}
// Both High
else if (fieldRisk == 'High' && fieldImpact == 'High') {
riskControl.style.backgroundColor = 'red';
impactControl.style.backgroundColor = 'red';
}
// Both Moderate
else if (fieldRisk == 'Moderate' && fieldImpact == 'Moderate') {
riskControl.style.backgroundColor = 'yellow';
impactControl.style.backgroundColor = 'yellow';
}
// Both Low
else if (fieldRisk == 'Low' && fieldImpact == 'Low') {
riskControl.style.backgroundColor = 'green';
impactControl.style.backgroundColor = 'green';
}
}
Below is advance javascript using switch case
function onLoad() {
//Type appropriate comment here, and begin script below
var riskControl = g_form.getControl('u_risk');
var impactControl = g_form.getControl('u_impact');
var fieldRisk = g_form.getValue('u_risk');
var fieldImpact = g_form.getValue('u_impact');
var condition = fieldRisk + '|' + fieldImpact;
switch (condition) {
case 'High|Low':
riskControl.style.backgroundColor = 'red';
impactControl.style.backgroundColor = 'green';
break;
case 'High|Moderate':
riskControl.style.backgroundColor = 'red';
impactControl.style.backgroundColor = 'yellow';
break;
case 'Moderate|High':
riskControl.style.backgroundColor = 'yellow';
impactControl.style.backgroundColor = 'red';
break;
case 'Moderate|Low':
riskControl.style.backgroundColor = 'yellow';
impactControl.style.backgroundColor = 'green';
break;
case 'Low|High':
riskControl.style.backgroundColor = 'green';
impactControl.style.backgroundColor = 'red';
break;
case 'Low|Moderate':
riskControl.style.backgroundColor = 'green';
impactControl.style.backgroundColor = 'yellow';
break;
case 'High|High':
riskControl.style.backgroundColor = 'red';
impactControl.style.backgroundColor = 'red';
break;
case 'Moderate|Moderate':
riskControl.style.backgroundColor = 'yellow';
impactControl.style.backgroundColor = 'yellow';
break;
case 'Low|Low':
riskControl.style.backgroundColor = 'green';
impactControl.style.backgroundColor = 'green';
break;
default:
break;
}
}
