DT:Datatable visibility in shiny dashboard

shiny
1

I'm trying to put a DT::datatable in a dashboard sidebar as in the example below. As you can see, the text of the table is not visible on the sidebar because of some color conflict. If you select a line on the table, the text becomes visible. I've tried all sorts of CSS hacks to get the datatable text to display properly in the sidebar but all I've succeeded in doing is making the text invisible in many different colors.

Does anyone know the proper way to get the table displayed properly on the sidebard background?
Thanks,
Andrew

library(shiny)
library(shinydashboard)
library(DT)


ui <- dashboardPage(
  
    dashboardHeader(),
    
    dashboardSidebar( width = 250,
          h3("Iris"),
          DT::dataTableOutput("iristbl")
    ),
    dashboardBody(
        
    )
)

server <- function(input, output) {
   
   output$iristbl <- renderDataTable({
       DT::datatable(iris[1:10,c(1:2)], rownames=FALSE, selection="single",options = list(paging=FALSE, searching=FALSE, ordering=FALSE, info=FALSE))
   })
}
2

Hi,

Have you tried using DT::formatStyle() on the server function? See the example on Using DT in Shiny, title 1. A Minimal Example:

DT::renderDT({
  datatable(iris) %>% formatStyle(
    'Sepal.Width',
    backgroundColor = styleInterval(3.4, c('gray', 'yellow'))
  )
})
1 Like
3

^He has the right answer, but to add some explanation: formatStyle() takes a column or number of columns, either by name('Sepal.Width') or by position (1), and a number of CSS properties to style the cells within that column.

In your case, you'd probably be interested in the color property of the text within the table.

2 Likes
4

Thanks. formatStyle was the ticket. I got hung up trying to apply CSS on the ui side.

1 Like