firmo23
firmo23

Reputation: 8404

Navigate through tabitems based on conditions matched in shiny dashboard

I have the shiny app below which contains 3 actionbuttons. Each button is connected with a certain tab. What I would like to do is to build the following architecture based on the content of tab Consent.

When the app is executed for first time the user lands on the Welcome tab. The Get started actionbutton is then pressed.

If the user has entered the consent.name n the relative textInput() Name in Consent tab, before pressing the Get started button then he will be moved to the Password tab.

If the user press the Get started button without having entered text in Name then he will be moved in Consent tab, enter text in Name, press Continue and then be moved to the Password tab.

I would like to know how to use those actionbuttons conditionally in order to navigate through tabs. Of course the user can go to whichever tab he wishes by clicking on the actionbuttons on top but the process described above is activated when the Get started button is clicked.

library(shiny)
library(shinydashboard)
library(shinydashboardPlus)
library(shinyjs)
mytitle <- paste0("Life, Death & Statins")
dbHeader <- dashboardHeaderPlus(

)

shinyApp(
  ui = dashboardPagePlus(
    header = dbHeader,
    sidebar = dashboardSidebar(width = "0px",
                               sidebarMenu(id = "sidebar", # id important for updateTabItems
                                           menuItem("Welcome", tabName = "well", icon = icon("house")),
                                           menuItem("Consent", tabName = "conse", icon = icon("line-chart")),
                                           menuItem("Password", tabName = "pswd", icon = icon("house"))
                                           
                               )           ),
    body = dashboardBody(
      fluidRow(
        column(6,),
        column(1,
               tags$li(class = "dropdown", actionButton("well", "Welcome"))),
        column(1,
               tags$li(class = "dropdown", actionButton("conse", "Consent"))),
        column(1,
               tags$li(class = "dropdown", actionButton("pswd", "Password")))
        ),
      
      tabItems(
        tabItem("well",
                         actionButton("button", "Get started",style='padding:4px; font-size:140%')),
        tabItem("conse",
                
                tags$hr(),
                fluidRow(column(3,textInput("name", label = ("Name"), value = "consent.name"))),
                tags$hr(),
                fluidRow(column(3,actionButton('continue', "Continue",style='padding:4px; font-size:180%')))
        ),
        tabItem("pswd",
                passwordInput("pwd", "Enter the Database browser password")
                  )
        
      ),
      
      
      
    )
    
  ),
  server<-shinyServer(function(input, output,session) { 
    hide(selector = "body > div > header > nav > a")
    observeEvent(input$well, {
      updateTabItems(session, "sidebar", "well")
    })
    observeEvent(input$conse, {
      updateTabItems(session, "sidebar", "conse")
    })
    observeEvent(input$pswd, {
      updateTabItems(session, "sidebar", "pswd")
    })
    
    
  }
  )
)

Upvotes: 0

Views: 223

Answers (1)

YBS
YBS

Reputation: 21297

One way to do it is add two more observeEvents as shown below:

server<-shinyServer(function(input, output,session) { 
    hide(selector = "body > div > header > nav > a")
    
    observeEvent(input$well, {
      updateTabItems(session, "sidebar", "well")
    })
    
    observeEvent(input$conse, {
      updateTabItems(session, "sidebar", "conse")
    })
      
    observeEvent(input$pswd, {
      updateTabItems(session, "sidebar", "pswd")
    })
    
    observeEvent(input$button, {
      if (is.null(input$name) | nchar(gsub("[[:space:]]", "", input$name))==0 | input$name=="consent.name" ) {
        updateTabItems(session, "sidebar", "conse")
      }
      
      if (!is.null(input$name) & nchar(gsub("[[:space:]]", "", input$name))>0 & input$name!="consent.name" ){
        updateTabItems(session, "sidebar", "pswd")
      }
    })
    
    observeEvent(input$continue, {
      if (!is.null(input$name) & nchar(gsub("[[:space:]]", "", input$name))>0 & input$name!="consent.name" ){
        updateTabItems(session, "sidebar", "pswd")
      }
      
    })
    
  }
  )

Upvotes: 2

Related Questions