Please I need help, I'm stuck with Changing color for cells on DT::dataTable - shiny

[JBarrios]

I am new to shiny/r and trying to change the background color of a cell (DT table) base on value of the Cell. For example, the cell value on the Rec_Color column are RED, GREEN and YELLOW. I would like to color the cell base o the string values. I try using the "formatStyle" function ( https://rstudio.github.io/DT/010-style.html) but it is not working for me. I am getting this error: (ERROR.You specified the columns: Rec_Color, but the column names of the data are). I am stuck..any help would be greatly appreciated. Here is the code for my table (and filter-inputs):

server <- function(input, output, session) {

output$spTable <- DT::renderDataTable ({data <- TrustSp_Data # Code for the trust species table and the selecInputs

if (input$Tax != "All") {
    data <- data[data$Taxon == input$Tax,] # selectInput for Taxa
}

if (input$Rcolor != "All") {
    data <- data[data$Rec_Color == input$Rcolor,]    # selectInput for Recovery color
}

if (input$Cstat != "All") {
    data <- data[data$Status == input$Cstat,]    # selectInput for conservation status 
}

if (input$Rtime != "All") {
    data <- data[data$Rec_Time == input$Rtime,]     # selectInput for Recovery Timeline 
}

if (input$Autho != "All") {
    data <- data[data$Authority == input$Autho,]      # selectInput for federal Authority 
}

data

}, rownames=FALSE, #remove first column row numbers
extensions = c('ColReorder','Responsive',"FixedHeader"),

caption = htmltools::tags$caption( # Add caption at the bottom of the table
style = 'caption-side: bottom; text-align: center;',
'Dataset:', htmltools::strong("Version 03-January 10, 2019")),

colnames = c("ID"=1,"Species Name"=3,"Scientific Name"=4, "Sustainability Color"=7, "Sustainability Timeline"=8, "ITIS ID"=9), # Change columns names

options = list(
fixedHeader = TRUE,
scrolly = TRUE,
colReorder = TRUE,
columnDefs = list(list(className = 'dt-center', targets = c(0,1,7))), # columns aligment to center
language = list(sSearch = "Search Table:"),
initComplete = JS(
"function(settings, json) {",
"$(this.api().table().header()).css({'background-color': '#22415e', 'color': '#fff'});",
"}")

) %>% formatStyle(columns = "Rec_Color",
backgroundColor = styleEqual(
c("GREEN", "RED", "YELLOW"), c('green', "red", 'yellow'))

)
}

}

[jhk0530]

You can use rowCallback option while building datatable.

Callback function should include JS function.

For example.

mycallback = function(i){
  JS(
    paste0("
      function(row, data, index){
        if(data[", i, "] == 'red'){
          $(row).find('td:eq(", i, ")').css({'background-color' : '", '#ff6363', "'});
        }
      }
    ")
  )
}

Note that this will use jquery ( $ keyword).

Regards

[JBarrios]

Hello jhk0530,

Thank you for your time and quick response. Unfortunately, I am not a programmer and I am not familiar with JS. I will give it a try but, I am not sure where to start. Thanks once again for your help!

JB