How to create the option of having each tab with its own date input range in shinydashboard

Viewed 46

I have five tabs in my shinydashboard. Four of these Five tabs have their own tables. Each of these tables are different from each other and have different date ranges. I want to have the option that when the user enters a date input in one of the tabs it will not affect the other tables and their input ranges. However with my code below this is not the case. If I choose a date range in my first tab this will affect what dates are being displayed in the other tabs. Here is my code below

#ui.R
#----


# Header -----------------------------------------------------------------------|
header<-dashboardHeader( title = "Marketing Dashboard"
  
)


# Sidebar ----------------------------------------------------------------------|

sidebar<-dashboardSidebar(
  sidebarMenu(
    menuItem("Overview", tabName ="overview", icon = icon("dashboard")),
    menuItem("User", tabName ="user", icon = icon("user")),
    menuItem("Behavior", tabName ="behavior", icon = icon("people-carry")),
    menuItem("Finance", tabName ="finance", icon = icon("piggy-bank")),
    menuItem("Weather", tabName ="weather", icon = icon("bolt"))
  )
)

# Body -------------------------------------------------------------------------|
  
body<-dashboardBody(theme = "solar.css",
  tabItems(
    tabItem(tabName = "overview",
      fluidRow(
        dateRangeInput("date",
                       label = 'Date range input',
                       start =  range(tib1$start_time)[2] - 7, end =  range(tib1$start_time)[2],
                       min = range(tib1$start_time)[1], max =  range(tib1$start_time)[2]
        )
      ),      
      fluidRow(
        DT::dataTableOutput("overviewtable")
      )
    ),
    tabItem(tabName = 'user',
            fluidRow(
              dateRangeInput("date",
                             label = 'Date range input',
                             start =  range(tib2$end_time)[2] - 7, end =  range(tib2$end_time)[2],
                             min = range(tib2$end_time)[1], max =  range(tib2$end_time)[2]
              )
            ),
            fluidRow(
              DT::dataTableOutput("usertable")
            )

    ),
    tabItem(tabName = 'behavior',
            fluidRow(
              dateRangeInput("date",
                             label = 'Date range input',
                             start =  range(tib3$start_time)[2] - 7, end =  range(tib3$start_time)[2],
                             min = range(tib3$start_time)[1], max =  range(tib3$start_time)[2]
              )
            ),
            fluidRow(
              DT::dataTableOutput("behaviortable")
            )
    ),
    tabItem(tabName = 'finance',
            fluidRow(
              dateRangeInput("date",
                             label = 'Date range input',
                             start =  range(tib4$start_time)[2] - 7, end =  range(tib4$start_time)[2],
                             min = range(tib4$start_time)[1], max =  range(tib4$start_time)[2]
              )
            ),
            fluidRow(
              DT::dataTableOutput("financetable")
            )
    ),
    tabItem(tabName = 'weather',
      fluidRow(
        tags$iframe(
          seamless = "seamless",
          src = "personal",
          height = 800,
          width = 1400
        )
      )
    )
  )
)



# UI ---------------------------------------------------------------------------|

ui = dashboardPage(
  header,
  sidebar,
  body
)

# server.R
#---------


server <- function(input,output){
  #Reactive for dateRangeInput in overview
  
  overviewdata<- reactive({
    filter(tib1, between(start_time, input$date[1], input$date[2]))
  })
  
  #Table for overview
  output$overviewtable<- DT::renderDataTable({
    DT::datatable(data =overviewdata(),
                  extensions = 'Buttons',
                  options = list(
                    dom = "Blfrtip",
                    buttons =
                      list("copy", list(
                        extend = "collection",
                        buttons = c("csv","excel","pdf"),
                        text ="Download"
                      ))#End of button customization
                  ))
  })
  #User Section -----------------------------------------------------------------|
  userdata<- reactive({
    filter(tib2, between(end_time, input$date[1], input$date[2]))
  })
  
  #Table for user
  output$usertable<- DT::renderDataTable({
    DT::datatable(data =userdata(),
                  extensions = 'Buttons',
                  options = list(
                    dom = "Blfrtip",
                    buttons =
                      list("copy", list(
                        extend = "collection",
                        buttons = c("csv","excel","pdf"),
                        text ="Download"
                      ))#End of button customization
                  ))
  })
  
  #Behavior section -------------------------------------------------------------|
  
  behaviordata<- reactive({
    filter(tib3, between(start_time, input$date[1], input$date[2]))
  })
  
  #Table for overview
  output$behaviortable<- DT::renderDataTable({
    DT::datatable(data = behaviordata(),
                  extensions = 'Buttons',
                  options = list(
                    dom = "Blfrtip",
                    buttons =
                      list("copy", list(
                        extend = "collection",
                        buttons = c("csv","excel","pdf"),
                        text ="Download"
                      ))#End of button customization
                  ))
  })
  
  #Finance section -------------------------------------------------------------|
  financedata<- reactive({
    filter(tib4, between(start_time, input$date[1], input$date[2]))
  })
  
  #Table for overview
  output$financetable<- DT::renderDataTable({
    DT::datatable(data = financedata(),
                  extensions = 'Buttons',
                  options = list(
                    dom = "Blfrtip",
                    buttons =
                      list("copy", list(
                        extend = "collection",
                        buttons = c("csv","excel","pdf"),
                        text ="Download"
                      ))#End of button customization
                  ))
  })
  
}

I have been looking online and will continue to look online for an answer but I don't see anything exactly pertaining to this question. Is there a way to put an ID on the dateInputeRange so that the reactive({}) function in the server side will know that the dateinpute range is from tab 1 , 2, etc.

1 Answers

your dateRangeInput takes inputId as argument. you can assign different IDs e.g. date_user, date_finance etc. instead of just 'date'. Then you reference each sepcific date_id when filtering in that tab. Alternatively, you can build one module that you call multiple times using ns function:

#ui.R
#----


# Header -----------------------------------------------------------------------|
header<-dashboardHeader( title = "Marketing Dashboard"
                         
)


# Sidebar ----------------------------------------------------------------------|

sidebar<-dashboardSidebar(
  sidebarMenu(
    menuItem("Overview", tabName ="overview", icon = icon("dashboard")),
    menuItem("User", tabName ="user", icon = icon("user")),
    menuItem("Behavior", tabName ="behavior", icon = icon("people-carry")),
    menuItem("Finance", tabName ="finance", icon = icon("piggy-bank")),
    menuItem("Weather", tabName ="weather", icon = icon("bolt"))
  )
)

# Body -------------------------------------------------------------------------|

body<-dashboardBody(theme = "solar.css",
                    tabItems(
                      tabItem(tabName = "overview",
                              fluidRow(
                                dateRangeInput("date_overview",
                                               label = 'Date range input',
                                               start =  range(tib1$start_time)[2] - 7, end =  range(tib1$start_time)[2],
                                               min = range(tib1$start_time)[1], max =  range(tib1$start_time)[2]
                                )
                              ),      
                              fluidRow(
                                DT::dataTableOutput("overviewtable")
                              )
                      ),
                      tabItem(tabName = 'user',
                              fluidRow(
                                dateRangeInput("date_user",
                                               label = 'Date range input',
                                               start =  range(tib2$end_time)[2] - 7, end =  range(tib2$end_time)[2],
                                               min = range(tib2$end_time)[1], max =  range(tib2$end_time)[2]
                                )
                              ),
                              fluidRow(
                                DT::dataTableOutput("usertable")
                              )
                              
                      ),
                      tabItem(tabName = 'behavior',
                              fluidRow(
                                dateRangeInput("date_behaviour",
                                               label = 'Date range input',
                                               start =  range(tib3$start_time)[2] - 7, end =  range(tib3$start_time)[2],
                                               min = range(tib3$start_time)[1], max =  range(tib3$start_time)[2]
                                )
                              ),
                              fluidRow(
                                DT::dataTableOutput("behaviortable")
                              )
                      ),
                      tabItem(tabName = 'finance',
                              fluidRow(
                                dateRangeInput("date_finance",
                                               label = 'Date range input',
                                               start =  range(tib4$start_time)[2] - 7, end =  range(tib4$start_time)[2],
                                               min = range(tib4$start_time)[1], max =  range(tib4$start_time)[2]
                                )
                              ),
                              fluidRow(
                                DT::dataTableOutput("financetable")
                              )
                      ),
                      tabItem(tabName = 'weather',
                              fluidRow(
                                tags$iframe(
                                  seamless = "seamless",
                                  src = "personal",
                                  height = 800,
                                  width = 1400
                                )
                              )
                      )
                    )
)



# UI ---------------------------------------------------------------------------|

ui = dashboardPage(
  header,
  sidebar,
  body
)

# server.R
#---------


server <- function(input,output){
  #Reactive for dateRangeInput in overview
  
  overviewdata<- reactive({
    filter(tib1, between(start_time, input$date_overview[1], input$date_overview[2]))
  })
  
  #Table for overview
  output$overviewtable<- DT::renderDataTable({
    DT::datatable(data =overviewdata(),
                  extensions = 'Buttons',
                  options = list(
                    dom = "Blfrtip",
                    buttons =
                      list("copy", list(
                        extend = "collection",
                        buttons = c("csv","excel","pdf"),
                        text ="Download"
                      ))#End of button customization
                  ))
  })
  #User Section -----------------------------------------------------------------|
  userdata<- reactive({
    filter(tib2, between(end_time, input$date_user[1], input$date_user[2]))
  })
  
  #Table for user
  output$usertable<- DT::renderDataTable({
    DT::datatable(data =userdata(),
                  extensions = 'Buttons',
                  options = list(
                    dom = "Blfrtip",
                    buttons =
                      list("copy", list(
                        extend = "collection",
                        buttons = c("csv","excel","pdf"),
                        text ="Download"
                      ))#End of button customization
                  ))
  })
  
  #Behavior section -------------------------------------------------------------|
  
  behaviordata<- reactive({
    filter(tib3, between(start_time, input$date_behaviour[1], input$date_behaviour[2]))
  })
  
  #Table for overview
  output$behaviortable<- DT::renderDataTable({
    DT::datatable(data = behaviordata(),
                  extensions = 'Buttons',
                  options = list(
                    dom = "Blfrtip",
                    buttons =
                      list("copy", list(
                        extend = "collection",
                        buttons = c("csv","excel","pdf"),
                        text ="Download"
                      ))#End of button customization
                  ))
  })
  
  #Finance section -------------------------------------------------------------|
  financedata<- reactive({
    filter(tib4, between(start_time, input$date_finance[1], input$date_finance[2]))
  })
  
  #Table for overview
  output$financetable<- DT::renderDataTable({
    DT::datatable(data = financedata(),
                  extensions = 'Buttons',
                  options = list(
                    dom = "Blfrtip",
                    buttons =
                      list("copy", list(
                        extend = "collection",
                        buttons = c("csv","excel","pdf"),
                        text ="Download"
                      ))#End of button customization
                  ))
  })
  
}


Related