This shiny app has a feature where users land on the 'Upload data' panel upon launching. To restrict access to the other two 'tabpanels', users must first upload both necessary files in the 'Upload data' tab. The condition for activating both tabs is that the CSV files uploaded through the first or second 'fileInput()' must be named 'csvone' and 'csvtwo'. Both files need to be uploaded, regardless of their order.
library(shiny)
library(shinyjs)
jscode <- "
shinyjs.disableTab = function(name) {
var tab = $('.nav li a[data-value=' + name + ']');
tab.bind('click.tab', function(e) {
e.preventDefault();
return false;
});
tab.addClass('disabled');
}
shinyjs.enableTab = function(name) {
var tab = $('.nav li a[data-value=' + name + ']');
tab.unbind('click.tab');
tab.removeClass('disabled');
}
"
css <- "
.nav li a.disabled {
background-color: #aaa !important;
color: #333 !important;
cursor: not-allowed !important;
border-color: #aaa !important;
}"
#ui.r
ui <- fluidPage(
useShinyjs(),
extendShinyjs(text = jscode, functions = c("disableTab","enableTab")),
inlineCSS(css),
# App title ----
titlePanel("Tabsets"),
# Sidebar layout with input and output definitions ----
sidebarLayout(
# Sidebar panel for inputs ----
sidebarPanel(
),
# Main panel for displaying outputs ----
mainPanel(
tabsetPanel( id="tabset",
tabPanel("Upload data", value="tab0",
fileInput("file1", "Choose CSV File",
multiple = TRUE,
accept = c("text/csv",
"text/comma-separated-values,text/plain",
".csv")),
fileInput("file2", "Choose CSV File",
multiple = TRUE,
accept = c("text/csv",
"text/comma-separated-values,text/plain",
".csv"))),
tabPanel("Resource Allocation", value="tab1"),
tabPanel("Time Series", value="tab2")
)
)
)
)
#server.r
server = function(input, output) {
print("test")
js$disableTab("tab1")
js$disableTab("tab2")
observe({
req(input$file1, input$file2)
js$enableTab("tab1")
js$enableTab("tab2")
})
}
shinyApp(ui, server)