CODEWITHSUNDEEP
rshinyshinydashboardshiny-servershinyapps
Saurabh
Saurabh

Reputation: 1626

Render dashboardSidebar dynamically only when user clicks tabPanel

I am trying to render the dashboardSidebar dynamically on the click of tabPanel, so that controls on all the tabs are not loaded at the initialization time of the app. For that I have created a function load_tab2 but this function is not rending anything on the tab click. Can someone please point out the issue with the code below?

library(shiny)
library(shinydashboard)

sidebar <- dashboardSidebar(
  collapsed = FALSE,
  sidebarMenu(
    id = "menu_sidebar",
    conditionalPanel(
      condition = "input.main_tab == 'tab_1'",
      selectizeInput(inputId = "t1", label = "Select by:", choices = c(as.character(30:40))),
      div("Hello Tab 1")
    ))
)

body <- dashboardBody(
  fluidRow(
    tabsetPanel(
      id = "main_tab",
      selected = "tab_1",
      tabPanel(title = "tab_1", "Tab content 1"),
      tabPanel(title = "tab_2", "Tab content 2")
    )
  )
)

load_tab2 <- function(input, output, session){
  observeEvent(input$main_tab == 'tab_2', {
    insertUI(
      selector = "#menu_sidebar",
      where = "afterEnd",
      ui = conditionalPanel(
        condition = "input.main_tab == 'tab_2'",
        selectizeInput(inputId = "t2", label = "Select by:", choices = c(as.character(40:50))),
        div("Hello Tab 2")
      ),
      immediate = TRUE,
      session = getDefaultReactiveDomain()
    )
  }, ignoreInit = TRUE, once = TRUE)
}

shinyApp(
  ui = dashboardPage(
    dashboardHeader(title = "tabBoxes"),
    sidebar,
    body
  ),
  server = function(input, output, session) {
    callModule(load_tab2, "load_tab2_id")
  }
)

Upvotes: 1

Views: 33

Answers (1)

Saurabh
Saurabh

Reputation: 1626

I fixed the problem by directly calling load_tab2 function inside server function.

library(shiny)
library(shinydashboard)

sidebar <- dashboardSidebar(
  collapsed = FALSE,
  sidebarMenu(
    id = "menu_sidebar",
    conditionalPanel(
      condition = "input.main_tab == 'tab_1'",
      selectizeInput(inputId = "t1", label = "Select by:", choices = c(as.character(30:40))),
      div("Hello Tab 1")
    ))
)

body <- dashboardBody(
  fluidRow(
    tabsetPanel(
      id = "main_tab",
      selected = "tab_1",
      tabPanel(title = "tab_1", "Tab content 1"),
      tabPanel(title = "tab_2", "Tab content 2")
    )
  )
)

load_tab2 <- function(input, output, session){
  observeEvent(input$main_tab == 'tab_2', {
    insertUI(
      selector = "#menu_sidebar",
      where = "afterEnd",
      ui = conditionalPanel(
        condition = "input.main_tab == 'tab_2'",
        selectizeInput(inputId = "t2", label = "Select by:", choices = c(as.character(40:50))),
        div("Hello Tab 2")
      ),
      immediate = TRUE,
      session = getDefaultReactiveDomain()
    )
  }, ignoreInit = TRUE, once = TRUE)
}

shinyApp(
  ui = dashboardPage(
    dashboardHeader(title = "tabBoxes"),
    sidebar,
    body
  ),
  server = function(input, output, session) {
    load_tab2(input, output, session)
  }
)

Upvotes: 1

Related Questions