Oracle APEX根據用戶輸入格式化一個單元格

Question

我目前正在協助創建一個Oracle APEX應用程序，我的任務是能夠'製作'表格中的單元格，根據用戶輸入自動更新單元格背景。 例如： 如果用戶輸入AL（年假），則會將背景格式化爲Yello 如果用戶輸入X，則會將單元格背景格式化爲灰色。 如果用戶輸入C（培訓課程），它會將其格式化爲'桃'

我已經在這裏看過，發現了一些指南，但沒有一個是專門爲此，這就是爲什麼我決定問一個新的題。表

樣，我想格式化：

有人告訴我，這可以在JavaScript中完成，這我有一定的瞭解 我在想，如果這個可以做到。 CSS？ 由於HTML不可能。

Answer 1

給區域一個靜態ID。 把這些樣式規則的地方，例如頁面標題：

<style> 
.annual{ 
background-color:yellow; 
} 
.ex{ 
background-color:grey; 
} 
.trainingcourse{ 
background-color:peach; 
} 
</style> 

運行這個JavaScript，但對你的報告的靜態ID替換STATICID。根據需要添加案例和類。這裏的優點是你從CSS中引導而不是使用jquery。如果你喜歡，你可以直接指定背景顏色，但我自己的偏好是保持這種分離。

$("#report_STATICID td[headers]").each(function(){ 
    var lTest = $(this).text(), lClass; 
    switch(lTest){ 
     case 'AL': 
     lClass = "annual"; 
     break; 
     case 'X': 
     lClass = "ex"; 
     break; 
     case 'C': 
     lClass = "trainingcourse"; 
     break; 
    }; 
    if(lClass){ 
     $(this).addClass(lClass); 
    }; 
}) 

---

編輯：可以從評論是顯而易見的，您使用的主題，因此模板的區域是在這些問題非常重要。
（注意：在下面的示例中，我使用了一個簡單的經典報表，基於帶有靜態id empreport的emp表上的select）
在這種情況下@Robovisits使用的是主題13 - 經典藍。首先要檢查的是標記：

這使您可以確定選擇器是否正確，並將目標正確的元素。驗證這一點的最好方法是通過在瀏覽器的開發人員工具中從控制檯運行選擇器並檢查返回值。
現在，當我運行此代碼：

$("#report_empreport td[headers]").each(function(){ 
    var lTest = $(this).text(), lClass; 
    switch(lTest){ 
     case 'KING': 
     lClass = "class1"; 
     break; 
     case 'PICARD': 
     lClass = "class2"; 
     break; 
     case 'FRANCINE': 
     lClass = "class3"; 
     break; 
    }; 
    if(lClass){ 
     $(this).addClass(lClass); 
    }; 
}) 

我然後右擊一個專欄中，我認爲應該受此影響，並選擇檢查元素（在這種情況下，我在Chrome的開發工具是）。

不錯，所以我在KING中的小區確實收到了正確的課。現在它爲什麼不着色？
因爲我想用CSS着色，我需要選擇在html窗格中受影響的元素，然後我可以在CSS面板中查詢到正確的：

正如你所看到的，類class1的CSS正在重寫！這裏發生的是另一個更具體的規則優先於我們的規則。坦率地說，選擇器越具體，其應用規則的優先級越高。 這可以通過給我選擇更多的「體重」來解決。

body table.t13Standard td.class1{ 
background-color:yellow; 
} 

！注：也有使用選項重要只需覆蓋任何東西，不管特異性。我通常會避免這種情況，除非它確實有意義。它看起來是這樣的：

.class1{ 
background-color:yellow !important; 
}