如何将 bootstrap 主题应用到 DT table 中的按钮

How to apply bootstrap theme to buttons in a DT table

我有一个闪亮的应用程序,可以在 DT-Table 中显示数据。我使用 Buttons 扩展来包含一个“Select All”和一个“Deselect All”按钮,并使用 shinythemes 来应用 bootstrap 主题。我将 class 分配给两个 DT 按钮,以便以与应用程序中所有其他按钮相同的方式对它们进行格式化。但是,这只会更改字体,不会更改按钮的颜色。

下面是一个应用程序的最小工作示例的屏幕截图,其中包括一个格式正确的正常操作按钮和两个格式不正确的 DT 按钮。请注意,我已将 class "btn btn-primary" 仅分配给“Select All”,以表明分配 class.[= 后字体确实发生了变化。 16=]

这是创建应用程序的代码:

library(shiny)
library(DT)

ui <- fluidPage(
  theme = shinythemes::shinytheme("lumen"),
  actionButton("button", "Click", class = "btn btn-primary"),
  dataTableOutput("table")
)

server <- function(input, output, session) {
  output$table <- renderDT(
    datatable(mtcars,
              extensions = c("Select", "Buttons"),
              selection = "none",
              options = list(
                dom = "Bfti",
                select = list(style = "multi"),
                buttons = list(
                  list(extend = "selectAll", className = "btn btn-primary"),
                  list(extend = "selectNone")
                )
              )
    ),
    server = FALSE
  )
}

shinyApp(ui, server)

如何以与“单击”按钮相同的方式设置“Select 全部”和“取消全选”按钮的格式?

我知道,当然,我可以简单地创建两个执行相同操作的普通操作按钮。但是,它们位于 table 上方,因此会占用更多的垂直空间 space,这是我不想要的。

  output$table <- renderDT(
    datatable(mtcars,
              extensions = c("Select", "Buttons"),
              selection = "none",
              options = list(
                dom = "Bfti",
                select = list(style = "multi"),
                buttons = list(
                  list(
                    extend = "selectAll", 
                    className = "btn btn-primary"
                  ),
                  list(
                    extend = "selectNone",
                    className = "btn btn-primary"
                  )
                ),
                initComplete = JS("function(){$('.dt-buttons button').removeClass('dt-button');}")
              )
    ),
    server = FALSE
  )