cross-conditional color formatting based on user input in Oracle Apex

1
votes

I am currently trying to add a feature to an existing Oracle Apex application (Apex). I have already looked around on here and found a few guides but none are helping me specifically with this subject and as I am a complete newbie to Oracle Apex, I am asking this question and thankful for any help:

how can I cross-conditionally color format the text of a text-field returned to the user (see link below) based on another item on the page? More or less like a succes/failure-message.

highlighted succes/failure-message-text

The content from the success/failure-message is returned from a stored procedure, which is run after the user scans a barcode for input (:P1_CANN, text field, label: 'Scanneingabe'). After running, the stored procedure returns two values: the content of the success/failure-message (:P1_CANNBACK, display only page item) and a value 1/0 for scan/failure of the scan (:P1_CSS,hidden page item). Based on the value returned from :P1_CSS I would like to color the text of the success/failure-message correspondingly, for instance to green if the returned value is 1 and red if it is 0.

I am using Oracle 12c as the database. The stored procedure runs a short PL/SQL-Code:

 *#OWNER#.DOMENICO_SCANN_ENT(PSCANN => :P1_CANN, pr => :P1_CANNBACK, pr1 => :P1_CSS);*.
1
oracleplsqloracle-apexoracle12c

1 Answers

1
votes

This can be achieved using css. There are different ways you can implement this. One way is this:

  1. Create a page item to contain the class name, eg P1_CANNBACK_CLASS
  2. Create a computation to set the value of P1_CANNBACK_CLASS after you have called your stored procedure. PL/SQL code would be something like
CASE :P1_CANN WHEN 1 THEN 'u-success-text' WHEN 0 THEN 'u-danger-text' END
  1. On Page Item P1_CANNBACK, set the css class to &P1_CANNBACK_CLASS.

enter image description here

Note that I used the apex provided css classes (documented here: https://apex.oracle.com/pls/apex/apex_pm/r/ut/color-and-status-modifiers). You can use your style, but then you'll have to define the css classes in the page properties or in a static file. I tested this on a 20.2 instance.