This blog will teach you how to conditionally change the background color of a select list in Oracle APEX. We will be focusing on a select list and changing the background color, but this same logic can be applied to the styling of most page items.
Select List for Anonymous Level
For this example, let’s pretend we have an APEX application for receiving donations. The form includes the option to choose an anonymous level because not all donors want to be recognized.
Background Color Change Dynamic Action
The anonymous level carries extra importance because selecting the wrong type of level could be disastrous. In order to help prevent people from choosing incorrectly, we will have the background color change if the anonymous level is 1 – Publication Internal Only or 2 – No Internal or External Publication.
To accomplish this, we need a Dynamic Action.
- Create a new Dynamic Action on the Anonymous Level select list
- Make the event a Change Event
- Add an Execute JavaScript Code True Action to the Dynamic Action
- Copy and paste the following code:
if ($v("P2_CODE_ANON") == 0){
$("#P2_CODE_ANON").css("background-color", "transparent");
}
else if ($v("P2_CODE_ANON") == 1){
$("#P2_CODE_ANON").css("background-color", "#F8F8BF");
}
else if ($v("P2_CODE_ANON") == 2){
$("#P2_CODE_ANON").css("background-color", "#EFD6CF");
}Give it a Test and See the Results
When you select 1 – Publication Internal Only, the background color should be yellow. Alternatively, when you select 2 – No Internal or External Publication, the background color should be red.
Requirements
- Oracle APEX 5x+
Disclaimer:
We do not take responsibility for any unintended or unwanted consequences in your instance of Oracle, Oracle APEX, or related products as a result of reading our blogs or following our guides. Though the information is fully tested and generally safe to use, our lawyers really have a thing against admitting potential wrongdoing. If it makes you feel any better, one time I convinced them that giving someone the middle finger is considered a term of endearment in France.
