R Shiny: Present a ShinyBS Modal Popup on page visit (no user action)

Question

I used bsModal successfully in my code before. However, I can't seem to get a modal pop up to show just when the user visits an app's first page by default. I thought something like this would work, but not. Any idea how I can trigger a bsModal on page visit?

library(shiny)
library(shinyBS)

ui <- fluidPage(
  mainPanel(
    bsModal(id = 'startupModal', title = 'Dum Dum', trigger = '',
            size = 'large', p("here is my mumbo jumbo")),
    width = 12
  )
)

server <- function(input, output, session) {

}

shinyApp(ui = ui, server = server)

I simply need to alert the user with a message when they visit the app and then allow them to close the modal pop up and navigate the rest of the app freely. I am using Shinydashboard. So, eventually, this has to work with that.

Answer 1

You can use toggleModal to manually trigger the popup from the server.

library(shiny)
library(shinyBS)

ui <- fluidPage(
  mainPanel(
    bsModal(id = 'startupModal', title = 'Dum Dum', trigger = '',
            size = 'large', p("here is my mumbo jumbo")),
    width = 12
  )
)

server <- function(input, output, session) {
  toggleModal(session, "startupModal", toggle = "open")
}

shinyApp(ui = ui, server = server)

Answer 2

Here is a solution using JS to trigger bsModal when page load "onload" from ui without waiting for the server . Along with a solution proposed here to prevent end users from accidentally closing the modal by clicking outside the modal or press Esc

library(shiny)
library(shinyBS)
bsModalNoClose <-function(...) {
     b = bsModal(...)
     b[[2]]$`data-backdrop` = "static"
     b[[2]]$`data-keyboard` = "false"
  return(b)
}


ui <- fluidPage(
       sidebarLayout(
          sidebarPanel(
              bsModalNoClose("window", "Window",
                  title="Enter Login Details",size='small',
                  textInput('username', 'Username'),
                  passwordInput('pwInp', 'Password'),
                  actionButton('butLogin', 'Login', class = 'btn action-button btn-success', icon = icon('sign-in')),
                  footer = h4(actionLink('create_account','Create an account'),align='right'),
                  tags$head(tags$style("#window .modal-footer{display:none}
                                       .modal-header .close{display:none}"),
                            tags$script("$(document).ready(function(){
                                        $('#window').modal();
                                        });")
                            ))
                  )
        ,mainPanel()
  ))

server <- function(input, output, session) {}

shinyApp(ui, server)

I hope it may be helpful for future readers.