CODEWITHSUNDEEP
shinydt
lmsimp
lmsimp

Reputation: 932

Add text colour to a specific column name (header) in DT Shiny datatable

I am fairly new to DT in Shiny and would like to add text colour to specific columns in a table, I can do this using formatStyle as per the below example code chunk. However, I would also like to add the same text colour to the corresponding column name (header), is there an easy way to do this?

library(shiny)
library(DT)

ui = fluidPage(DT::dataTableOutput('fDataTable'))

server = function(input, output) {
  output$fDataTable = DT::renderDataTable({
    DT::datatable(iris) %>%
      formatStyle(columns = 1, color = "red") %>%
      formatStyle(columns = 3, color = "blue")
  })
}  

app = list(ui = ui, server = server)
runApp(app)

Any help would be greatly appreciated.

Upvotes: 4

Views: 4896

Answers (1)

NicE
NicE

Reputation: 21425

You can do this by adding CSS to the colnames of the table you are rendering (you also need to set escape to FALSE or the html will be escaped).

Here's an example:

library(shiny)
library(DT)

ui = fluidPage(DT::dataTableOutput('fDataTable'))

server = function(input, output) {
  output$fDataTable = DT::renderDataTable({
    iris_coloured <- iris
    colnames(iris_coloured)[c(1,3)] <- paste0('<span style="color:',c("red","blue"),'">',colnames(iris)[c(1,3)],'</span>')
    DT::datatable(iris_coloured,escape=F) %>%
      formatStyle(columns = 1, color = "red") %>%
      formatStyle(columns = 3, color = "blue")
  })
}  

app = list(ui = ui, server = server)
runApp(app)

Upvotes: 9

Related Questions