shinjs::show() not showing element after shinyjs::hide() - r

Question

I have a shiny dashboard where I'm trying to use action buttons to select through what to show instead of the menu tabs. I have it built so that when you click the action button assigned to one specific fluid row it will hide the other tabs, but I can't seem to get it to bring the fluid row back. I'm using shinyjs show and hide functions.
this is the code I have in my ui
dashboardBody(
tags$head(
tags$link(
rel = "stylesheet",
type = "text/css",
href = "datainstate_style.css")
),
useShinyjs(),
introjsUI(),
# MAIN BODY ----------------------------------------------------------------
fluidRow(
column(
width = 12,
bsButton("VsOpponent",
label = "Vs Opponent",
icon = icon("users"),
style = "success"),
bsButton("trendsinperformance",
label = "Trends",
icon = icon("digital-tachograph"),
style = "success"),
bsButton("lineupsandchampions",
label = "Lineups and Champions",
icon = icon("child"),
style = "success")
)
),
fluidRow(
div( id = "VsOpponent_panel",
column(
width = 12,
gt_output("opponents_table")
),
column(
width = 12,
plotOutput("radar_plot")
),
column(
width = 12,
plotOutput("gold_plot")
)
)
),
fluidRow(
div( id = "trendsinperformance_panel",
column(
width = 12,
plotOutput("gold")
)
)
),
fluidRow(
div( id = "lineupsandchampions_panel",
column(
width = 12,
textOutput("test")
)
)
)
)
And then the code in my server that corresponds to this is below
## Determine which panel to show
observeEvent("", {
show("VsOpponent_panel")
hide("lineupsandchampions_panel")
hide("trendsinperformance_panel")
}, once = TRUE)
observeEvent(input$VsOpponent, {
show("VsOpponent_panel")
hide("lineupsandchampions_panel")
hide("trendsinperformance_panel")
})
observeEvent(input$trendsinperformance, {
show("trendsinperformance_panel")
hide("lineupsandchampions_panel")
hide("VsOpponent_panel")
})
observeEvent(input$lineupsandchampions, {
show("lineupsandchampions_panel")
hide("trendsinperformance_panel")
hide("VsOpponent_panel")
})
Thanks for your help!

Answer 1

Hmm, the buttons seem to work for me as expected, try to hide the divs first then show the other ones
library(shiny)
library(shinyjs)
library(shinyBS)
ui <- fluidPage(
useShinyjs(),
fluidRow(
column(
width = 4,
bsButton("VsOpponent",
label = "Vs Opponent",
icon = icon("users"),
style = "success"),
bsButton("trendsinperformance",
label = "Trends",
icon = icon("digital-tachograph"),
style = "success"),
bsButton("lineupsandchampions",
label = "Lineups and Champions",
icon = icon("child"),
style = "success")
)
),
fluidRow(
div(id = "VsOpponent_panel",
column(
width = 4,
plotOutput("p1")
),
column(
width = 4,
plotOutput("p2")
),
column(
width = 4,
plotOutput("p3")
)
)
),
fluidRow(
div( id = "trendsinperformance_panel",
column(
width = 4,
plotOutput("p4")
)
)
),
fluidRow(
div( id = "lineupsandchampions_panel",
column(
width = 4,
plotOutput("p5")
)
)
)
)
server <- function(input, output, session) {
output$p1 <- renderPlot({plot(runif(10),main = "Plot1")})
output$p2 <- renderPlot({plot(runif(10),main = "Plot2")})
output$p3 <- renderPlot({plot(runif(10),main = "Plot3")})
output$p4 <- renderPlot({plot(runif(10),main = "Plot4")})
output$p5 <- renderPlot({plot(runif(10),main = "Plot5")})
## Determine which panel to show
observeEvent("", {
hide("lineupsandchampions_panel")
hide("trendsinperformance_panel")
show("VsOpponent_panel")
}, once = TRUE)
observeEvent(input$VsOpponent, {
hide("lineupsandchampions_panel")
hide("trendsinperformance_panel")
show("VsOpponent_panel")
})
observeEvent(input$trendsinperformance, {
hide("lineupsandchampions_panel")
hide("VsOpponent_panel")
show("trendsinperformance_panel")
})
observeEvent(input$lineupsandchampions, {
hide("trendsinperformance_panel")
hide("VsOpponent_panel")
show("lineupsandchampions_panel")
})
}
shinyApp(ui, server)