CODEWITHSUNDEEP
rshinyshinydashboard
firmo23
firmo23

Reputation: 8404

Display box after actionButton is pressed in a shiny dashboard

I have the shiny app below and I would like the box to be displayed only when the actionButton is pressed. Otherwise it is confusing for the user as he sees an empty box without the plot.

library(shiny)
library(shinydashboard)
library(shinydashboardPlus)

shinyApp(
  ui = tags$body(class="skin-blue sidebar-mini control-sidebar-open",dashboardPage(
    options = list(sidebarExpandOnHover = TRUE),
    header = dashboardHeader(title = "Investment Advisor Monitoring - Insider Trading",titleWidth = 450),
    
    sidebar = dashboardSidebar(minified = F, collapsed = F,
                               actionButton("go", "Go"),
                               numericInput("n", "n", 50)
    ),
    body = dashboardBody(
      box(
        title = "StockPrice Reaction Around The Event Date", status = "primary", solidHeader = TRUE,
        collapsible = TRUE,
      plotOutput("plot"))
      
    ),
    title = "DashboardPage"
  )),
  server = function(input, output) { 
    
    randomVals <- eventReactive(input$go, {
      runif(input$n)
    })
    
    output$plot <- renderPlot({
      hist(randomVals())
    })
  }
)

Upvotes: 0

Views: 778

Answers (1)

Mwavu
Mwavu

Reputation: 2217

Use shinyjs::hidden() & shinyjs::show() together with observeEvent().

Your example now becomes:

library(shiny)
library(shinydashboard)
library(shinydashboardPlus)
library(shinyjs)

ui <- tags$body(
  class="skin-blue sidebar-mini control-sidebar-open", 
  
  dashboardPage(
    options = list(sidebarExpandOnHover = TRUE), 
    
    # ----header----
    header = dashboardHeader(
      title = "Investment Advisor Monitoring - Insider Trading",
      titleWidth = 450
    ), 
    
    # ----sidebar----
    sidebar = dashboardSidebar(
      minified = FALSE, 
      collapsed = FALSE,
      actionButton("go", "Go"),
      numericInput("n", "n", 50)
    ), 
    
    # ----body----
    body = dashboardBody(
      useShinyjs(), # MUST include this line
      
      # ----hiddenbox----
      shinyjs::hidden(
        div(
          id = "hiddenbox", 
          
          box(
            title = "StockPrice Reaction Around The Event Date", 
            status = "primary", 
            solidHeader = TRUE,
            collapsible = TRUE,
            plotOutput("plot")
          )
        )
      )
    )
  )
)


server <- function(input, output, session) { 
  randomVals <- eventReactive(input$go, {
    runif(input$n)
  })
  
  # ----show hiddenbox----
  observeEvent(input$go, {
    shinyjs::show(id = "hiddenbox")
  })
  
  output$plot <- renderPlot({
    hist(randomVals())
  })
}

shinyApp(ui, server)

Upvotes: 1

Related Questions