Code Sample for Color Coding of Fields and Rows

The following code sets colors on pages as follows:

  • On the Opportunity Detail or Edit page, the colors of the label and value for the Primary Revenue Win Probability field are set, depending on the percentage value entered in the field.

  • On the Opportunity List page, the colors for the Primary Revenue Win Probability field are set, depending on the percentage value entered in the field, and rows where the Priority field has the value High are colored yellow.

  • On the Contact related item list of the Opportunity page, the color of the Role field is set, if the value of the field is Decision Maker.

  • On any page where there is a Name field, the field label background color is set to black, the field label text color to red, the field value background color to red, and the field value text color to black.

//color function for coloring the Opp detail/edit page
function colorOppty()

{

	//on the Opportunity detail/edit page, change the color for the Probability field depending on the percentage entered

	var percent= oraclecrmod.getField("Primary Revenue Win Probability");
	colorPercent(percent);

}
//color function for coloring the Opp List
function colorOpptyList(row)
{

	var percent= row.getField("Primary Revenue Win Probability");
	var priority = row.getField("Priority");
	colorPercent(percent);
	if (priority != null)
	{

			//set the row to Yellow in the list if the priority is High
			if (priority.getValue()=="High")
			{

				row.setColor({rowBgColor:"yellow"});
			} else {
					row.setColor({rowBgColor:""}); //this clears previous set color and will display based on theme color

			}
		}
}
//common color function to color the Probability field in the same way in the list page as it is colored on the detail/edit page
function colorPercent(percent)
{
	var myred = "#e71832";
	var myblue = "rgb(66,97,156)";
	var myyellow= "rgb(255,215,181)";
	if (percent != null)
	{

		if(percent.getValue()> 50)

		{

			percent.setColor({"labelBgColor":myred,"labelTextColor":myblue,"valueBgColor":myblue,"valueTextColor":myred});

		}
		else { 

			percent.setColor({"labelBgColor":"","labelTextColor":"","valueBgColor":"","valueTextColor":""}); //this clears previous set color and will display based on theme color
		}
	} 
} 
//color function for coloring the Opp's Contact Child List
function colorOpptyContactChildList(row)

{

		var role = row.getField("Role");
		if (role != null)
		{
				//set the row to Cyan in the list if the contact's role is Decision maker
				//change text of role to Red as well
				if (role.getValue()=="Decision Maker")
				{

					row.setColor({rowBgColor:"cyan"});
					role.setColor({valueTextColor:"Red"});
				}
				else {
					row.setColor({rowBgColor:""}); //this clears previous set color and will display based on theme color

					role.setColor({valueTextColor:""}); //this clears previous set color and will display based on theme color

			}

		}

}
// entry point for running custom code
oraclecrmod.onReady(function()
{   
			//if Name field exists on the form, then set the field label background to Black, field label text to Red, value background to red and value text to black

			//for example, this applies to Account Name on Account detail/edit page and Opportunity Name on Opportunity detail/edit page

			var name =  oraclecrmod.getField("Name");

			if (name != null) name.setColor({"labelBgColor": "Black","labelTextColor":"#ff0000","valueBgColor": "#ff0000","valueTextColor":"Black"});

			//get the form on the page for Opportunity
			if(oraclecrmod.ctx.object == "Opportunity")
			{

				//for the opportunity list page
				if (oraclecrmod.ctx.isListPage())
				{

					var oppList = oraclecrmod.getList();
					if(oppList != null)
					{
						oppList.on("display", colorOpptyList);
					}
				} else {
				//for detail/edit pages, etc
					if (oraclecrmod.getForm() != null)
				{

					oraclecrmod.getForm().on("display", colorOppty); //set the custom function to run on display of the form

				}
				var contactList = oraclecrmod.getList("ContactRoleChildList");
				if(contactList != null) {
					contactList.on("display", colorOpptyContactChildList); }
				}
		}
});