行選択でRのデータテーブルのbg色を変更するShiny

Question

R Shiny Appで選択したデータテーブルのbg色を変更しようとしています。 CSSコードを書いていますが、既存のCSSを上書きすることはできません。それを達成するための回避策。ここで

は、コードの私の作品です：

UI

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

shinyUI(
dashboardPage (
dashboardHeader(title="Report"), 
dashboardSidebar(sidebarMenu(menuItem("Table",tabName="Table"))), 
dashboardBody(
tags$head(tags$style(HTML(" 

#DataTable tr.selected {background-color:cyan !important;} 

table.dataTable.hover tbody tr:hover, table.dataTable.display tbody tr:hover { 
          background-color: rgb(143,209,63) !important; 
} 



.odd { 
background-color : rgb(173,219,241) !important; 
} 

.even { 
background-color : rgb(232,245,251) !important; 
} 

"))), 
useShinyjs() , 
      tabItems(
      tabItem(tabName = "Table", 
        DT::dataTableOutput("DataTable")  
        ) 
)) 
)) 

サーバーここで

shinyServer(function(input, output) { 

output$DataTable <- DT::renderDataTable({ 
    datatable(iris,rownames=FALSE,selection = 'single',options = list(
    searching = FALSE,ordering=FALSE, 
    dom = 'Bfrtip', 
    buttons = c('copy','excel', 'pdf', 'print', 'colvis'), 
    columnDefs = list(list(visible=FALSE, targets=c(2))), 
    rowCallback = JS(
    "function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {", 
    "var full_text = aData[2]", 
    # Tooltip for the rows 
    "$('td:eq(1)', nRow).attr('title', full_text);", 
    # Showing a hand as a cursor 
    "$('td:eq(1)', nRow).css('cursor','pointer');", 
    "$('td:eq(1)', nRow).css('font-weight','bold');", 
    "}") 
    ) 
    ) 
    }) 

Answer 1

更新されたコードです：

UIは

shinyUI(
dashboardPage (
dashboardHeader(title="Report"), 
dashboardSidebar(sidebarMenu(menuItem("Table",tabName="Table"))), 
dashboardBody(

tags$style(HTML(" 
table.dataTable tr.selected td, 
       table.dataTable td.selected { 
       background-color: rgb(143,209,63) !important; 
       } 
       ")), 


tags$head(tags$style(HTML(" 

table.dataTable.hover tbody tr:hover, table.dataTable.display tbody tr:hover { 
          background-color: rgb(143,209,63) !important; 
}  

.odd { 
background-color : rgb(173,219,241) !important; 
} 

.even { 
background-color : rgb(232,245,251) !important; 
} 

"))), 
useShinyjs() , 
      tabItems(
      tabItem(tabName = "Table", 
        DT::dataTableOutput("DataTable")  
        ) 
)) 
)) 

サーバー

shinyServer(function(input, output) { 

output$DataTable <- DT::renderDataTable({ 
datatable(iris,rownames=FALSE,selection = 'single',options = list(
searching = FALSE,ordering=FALSE, 
dom = 'Bfrtip', 
buttons = c('copy','excel', 'pdf', 'print', 'colvis'), 
columnDefs = list(list(visible=FALSE, targets=c(2))), 
rowCallback = JS(
"function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {", 
"var full_text = aData[2]", 
# Tooltip for the rows 
"$('td:eq(1)', nRow).attr('title', full_text);", 
# Showing a hand as a cursor 
"$('td:eq(1)', nRow).css('cursor','pointer');", 
"$('td:eq(1)', nRow).css('font-weight','bold');", 
"}") 
) 
) 
})