R Shiny：隐藏/显示基于单选按钮的 Table

Question

我有两个 table，我试图根据用户在单选按钮中的输入一次显示一个。如果单选按钮的输入是“table”，我想显示 table1。如果输入是 else 我想显示 table2.

  observeEvent(input$visuBtn,{
    req(input$visuBtn)
    print(input$visubtn)
    if(input$visuBtn == "table"){
      hide("table2")
      #DT::dataTableOutput("table1")
      renderUI(
        DT::dataTableOutput("table1")
      )
    }else{
      print("Should show table2")
      # removeUI(
      #   selector = "table"
      # )
      renderUI(
        DT::dataTableOutput("table2")
      )
      #DT::dataTableOutput("table2")
      #show("table2")
    }
  })

我试过通过显示和隐藏两个 table 来做到这一点，但不知道如何让它发挥作用。我也尝试过使用 renderUI。最好的方法是什么？

     mainPanel(
       tabsetPanel(id = "sim.tabset",
         tabPanel(title = "Results",
                  # tableOutput("table")
                  DT::dataTableOutput("table"),
                  DT::dataTableOutput("table2")


         ),

         )

Answer 1

根据您的应用，您可以在前端切换 table 的可见性，稍微 javascript。在 UI 中，创建一个按钮并将 dataTableOutput 包装在通用容器中。

# some where in your UI
actionButton("toggleTable", "Toggle Table"),
tags$div(
    id = "tableContainer",
    DT::dataTableOutput("table")
)
...

有很多方法可以切换元素的可见性（更改显示属性、切换 css 类、修改其他属性等）。单击按钮时，以下函数会切换 html 属性 hidden。这可以在 UI 中使用 tags$script 函数定义或从外部 javascript 文件加载。

const btn = document.getElementById('toggle');
const elem = document.getElementById('tableContainer');
btn.addEventListener('click', function(event) {
    if (elem.hasAttribute('hidden')) {
        elem.removeAttribute('hidden');
    } else {
        elem.setAttribute('hidden', '');
    }
});

在服务器中，正常呈现数据table，您可以删除切换（除非您需要在单击按钮时发生其他事情）。

这是完整的例子。

library(shiny)

shinyApp(
    ui = tagList(
        tags$main(
            id = "main",
            tags$h1("Collapsible Table Example"),
            actionButton("toggleTable", "Toggle Table"),
            tags$div(
                id = "tableContainer",
                DT::dataTableOutput("table")
            )
        ),
        tags$script(
            type = "text/javascript",
            "
            const btn = document.getElementById('toggleTable');
            const elem = document.getElementById('tableContainer');
            btn.addEventListener('click', function(event) {
                if (elem.hasAttribute('hidden')) {
                    elem.removeAttribute('hidden');
                } else {
                    elem.setAttribute('hidden', '');
                }
            });
            "
        )
    ),
    server = function(input, output, session) {
        output$table <- DT::renderDataTable({
            data.frame(
                group = sample(c("A", "B"), 20, replace = TRUE),
                x = rnorm(n = 20, mean = 50, sd = 2),
                y = rnorm(n = 20, mean = 50, sd = 2)
            )
        })
    }
)

Answer 2

我选择了一个简单的解决方案，只有一个 table 根据单选按钮的选择呈现。意思是 if/else 就在 renderDataTable 函数中

library(shiny)
library(DT)

ui <- fluidPage(
  radioButtons("Buttons", "CHOOSE!", choices = c("MTCARS", "IRIS")),
  DT::dataTableOutput("THETABLE")
  
)

server <- function(input, output, session) {
  output$THETABLE<-DT::renderDataTable({
    req(input$Buttons)
    if(input$Buttons == "MTCARS") {
      DT::datatable(mtcars)
    } else {
      DT::datatable(iris)
    }
  })
}

shinyApp(ui, server)

或者，您可以使用条件面板，这样它会根据单选按钮选择显示 table：

library(shiny)
library(DT)

ui <- fluidPage(
  radioButtons("Buttons", "CHOOSE!", choices = c("MTCARS", "IRIS")),
  conditionalPanel("input.Buttons == 'MTCARS'", 
                   DT::dataTableOutput("TABLEMTCARS")
                   ),
  conditionalPanel("input.Buttons == 'IRIS'",
                   DT::dataTableOutput("TABLEIRIS"))
  
)

server <- function(input, output, session) {
  output$TABLEMTCARS<-DT::renderDataTable({
    DT::datatable(mtcars)
  })
  
  output$TABLEIRIS<-DT::renderDataTable({
    DT::datatable(iris)
  })
}

shinyApp(ui, server)

R Shiny：隐藏/显示基于单选按钮的 Table

RShiny: Hiding / Showing a Table based on Radio Buttons

r

shiny

hide

show

dt