Unable to hide/show a fluid page in RShiny application - r

Question

I am current developing a shiny application and I need to hide login page and show shiny dashboard upon successful login. If not, the login page should be displayed.
I came upon few sites and I decided to use shinyjs package for showing and hiding of the fluid page / dashboard page.
The global function used is as follows:
`%AND%` <- function (x, y) {
if (!is.null(x) && !anyNA(x))
if (!is.null(y) && !anyNA(y))
return(y)
return(NULL)
}
passwordInputAddon <- function (inputId, label, value = "", placeholder = NULL, addon, width = NULL)
{
value <- shiny::restoreInput(id = inputId, default = value)
htmltools::tags$div(
class = "form-group shiny-input-container",
label %AND% htmltools::tags$label(label, `for` = inputId),
style = if (!is.null(width)) paste0("width: ", htmltools::validateCssUnit(width), ";"),
htmltools::tags$div(
style = "margin-bottom: 5px;", class="input-group",
addon %AND% htmltools::tags$span(class="input-group-addon", addon),
htmltools::tags$input(
id = inputId, type = "password", class = "form-control",
value = value, placeholder = placeholder
)
)
)
}
The UI code used is as follows:
ui <- shinyUI(fluidPage(
tags$div(id = "login_page_ui",
shinyjs::useShinyjs(),
tags$style(".container-fluid {margin-top: 13%}"),
setBackgroundColor(color = "#2d3c44"),
fluidRow(
column(8, align = "center", offset = 2,
textInputAddon("name", label = "", placeholder = "Username", addon = icon("user"),width = "25%"),
tags$style(type="text/css", "#string { height: 50px; width: 50%; text-align:center;
font-size: 30px; display: block;}")
)
),
fluidRow(
column(8, align = "center", offset = 2,
passwordInputAddon("password", label = "", placeholder = "Password", addon = icon("key"),width = "25%"),
tags$style(type="text/css", "#string { height: 50px; width: 50%; text-align:center;
font-size: 30px; display: block;}")
)
),
fluidRow(
column(12, div(style = "height:20px;background-color: #2d3c44;")
)
),
fluidRow(
column(6, align = "center", offset = 3,
actionButton("login",label = "Login", width = "35%", style = "color: #fff; background-color: #1bc3d7; border-color: #1bc3d7;")))
)
),
shinyjs::hidden(
tags$div(
id = "dashboard_page_ui",
dashboardPage(
dashboardHeader(
title="Shiny Dashboard",
tags$li(
class="dropdown"
)
),
dashboardSidebar(
sidebarMenu(
id = 'dashboard_menu',
sidebarMenuOutput("menu")
)
),
dashboardBody(
tabItems(
tabItem(tabName="Item1"),
tabItem(tabName="Item2"),
tabItem(tabName="Item3")
)
)
)
)
)
)
The server code used is as follows:
server <- function(input, output,session){
observeEvent(input$login,{
if((input$name == "test") & (input$password == "test123")){
shinyjs::show("dashboard_page_ui")
shinyjs::hide("login_page_ui")
}
})
}
When I execute this code I am getting this error message
Error in shinyUI(fluidPage(tags$div(id = "login_page_ui", shinyjs::useShinyjs(), :
unused argument (shinyjs::hidden .....
I don't know what's the exact issue is. Can anyone help me to sort this issue?

Answer 1

shinyUI takes a single argument ui (The user interace definition). However, you provided two arguments: see the comma before shinyjs::hidden(...) in your code.
Please check the following:
library(shiny)
library(shinydashboard)
`%AND%` <- function (x, y) {
if (!is.null(x) && !anyNA(x))
if (!is.null(y) && !anyNA(y))
return(y)
return(NULL)
}
passwordInputAddon <-
function (inputId,
label,
value = "",
placeholder = NULL,
addon,
width = NULL)
{
value <- shiny::restoreInput(id = inputId, default = value)
htmltools::tags$div(
class = "form-group shiny-input-container",
label %AND% htmltools::tags$label(label, `for` = inputId),
style = if (!is.null(width))
paste0("width: ", htmltools::validateCssUnit(width), ";"),
htmltools::tags$div(
style = "margin-bottom: 5px;",
class = "input-group",
addon %AND% htmltools::tags$span(class = "input-group-addon", addon),
htmltools::tags$input(
id = inputId,
type = "password",
class = "form-control",
value = value,
placeholder = placeholder
)
)
)
}
ui <- fluidPage(
tags$div(
id = "login_page_ui",
shinyjs::useShinyjs(),
tags$style(".container-fluid {margin-top: 13%}"),
setBackgroundColor(color = "#2d3c44"),
fluidRow(
column(
8,
align = "center",
offset = 2,
textInputAddon(
"name",
label = "",
placeholder = "Username",
addon = icon("user"),
width = "25%"
),
tags$style(
type = "text/css",
"#string { height: 50px; width: 50%; text-align:center;
font-size: 30px; display: block;}"
)
)
),
fluidRow(
column(
8,
align = "center",
offset = 2,
passwordInputAddon(
"password",
label = "",
placeholder = "Password",
addon = icon("key"),
width = "25%"
),
tags$style(
type = "text/css",
"#string { height: 50px; width: 50%; text-align:center;
font-size: 30px; display: block;}"
)
)
),
fluidRow(column(
12, div(style = "height:20px;background-color: #2d3c44;")
)),
fluidRow(column(
6,
align = "center",
offset = 3,
actionButton(
"login",
label = "Login",
width = "35%",
style = "color: #fff; background-color: #1bc3d7; border-color: #1bc3d7;"
)
))
),
shinyjs::hidden(tags$div(
id = "dashboard_page_ui",
dashboardPage(
dashboardHeader(title = "Shiny Dashboard",
tags$li(class = "dropdown")),
dashboardSidebar(sidebarMenu(id = 'dashboard_menu',
sidebarMenuOutput("menu"))),
dashboardBody(tabItems(
tabItem(tabName = "Item1"),
tabItem(tabName = "Item2"),
tabItem(tabName = "Item3")
))
)
))
)
server <- function(input, output, session) {
observeEvent(input$login, {
if ((input$name == "test") & (input$password == "test123")) {
shinyjs::show("dashboard_page_ui")
shinyjs::hide("login_page_ui")
}
})
}
shinyApp(ui, server)