Using shinyjs to have conditional table in main and inputselect in sidebar

Hi
I am trying to have a sidebarLayout with conditional panels and on top of that show stuff on a panel if a button is clicked. The goal is to have either the "macroeconomic" table shown or the "sectoral" table (see the code below).
For the macroeconomic table, I have a selectInput that shows up when clicking the button "macroeconomic". However, using the same structure with "hide" for showing the table in the mainPanel doesn't work.

Any ideas why this is not working are more than welcome.

library(shiny)
library(DT)
library(tidyverse)
library(shinyjs)
mydata <- iris
ui <- fluidPage(
  useShinyjs(), # For buttons
  titlePanel("The Nexus Framework"),
  sidebarLayout(
    sidebarPanel(
      conditionalPanel(
        condition = "input.tabs == 'CGE'",

        h2('CGE Results'),

        actionButton("button1", "Macroeconomic"),
        actionButton("button2", "Sectoral"),

        hidden(
          div(id='macroB',
              selectInput('variable',
                          h4('Select variable'),
                          choices = unique(as.character(mydata$Species),
                                           selected = "GDPn"
                                           )
                          ) # End selectInput
              )
        ) # End hidden

      ) # End conditionalPanel
    ), # End sidebarPanel

    mainPanel(
      tabsetPanel(
        type = 'tabs',
        id = 'tabs',
        tabPanel('CGE',
                 hidden(
                   div(id='macroB',
                       DTOutput('table')
                       )
                 ) # End hidden
                 ),
        tabPanel('GEP'
                  )
      ) # End tabsetPanel
    ) # End mainPanel
  ) # End sidebarLayout
) # End fluidPage

server <- function(input, output) {

  macroData <- reactive({
    input_variable <- sym(input$variable)
    mydata %>%
      filter(Species ==  input_variable)
  }) # End reactive

  output$table <- renderDT({
    macroData() %>%
      DT::datatable(options = list(pageLength = 10,
                                   style = "bootstrap",
                                   rownames = FALSE))
  }) # End output$table

  observeEvent(input$button1, {
    toggle('macroB')  # toggle is a shinyjs function
  }) # End observeEvent
} # End server function

shinyApp(ui, server)

Cheers
Renger

To toggle multiple elements, give them the same class rather than id (class = "macroB") and then use the selector argument of toggle with the .class selector notation to toggle all elements of that class:

toggle(selector = ".macroB")
2 Likes

Great! Thanks a lot.
Renger

1 Like