Search code examples
rshinyshinydashboardshinyjs

disabling/enabling sidebar from server side

Is there any way to manually disabling/enabling the sidebar on shiny dashboard app from the server side?

I would like to hide the sidebar automatically when I need more space without using toggle button on the header.

Thank you

Solution

  • I'm not very familiar with dashboards as I never built one, but from a taking a quick look, it seems like when clicking on the open/hide sidebar button, all that happens is a sidebar-collapse class gets added/removed to the <body> tag. Maybe more things happen that I'm unaware of, but that seemed to be the most visible thing.

    So you can easily use shinyjs package (disclaimer: I'm the author) to add/remove that class

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

shinyApp(
  ui = 
    dashboardPage(
      dashboardHeader(),
      dashboardSidebar(),
      dashboardBody(
        shinyjs::useShinyjs(),
        actionButton("showSidebar", "Show sidebar"),
        actionButton("hideSidebar", "Hide sidebar")
      )
    ),
  server = function(input, output, session) {
    observeEvent(input$showSidebar, {
      shinyjs::removeClass(selector = "body", class = "sidebar-collapse")
    })
    observeEvent(input$hideSidebar, {
      shinyjs::addClass(selector = "body", class = "sidebar-collapse")
    })
  }
)