Change backdrop for a bsModal in Shiny app

问题

I am developing a Shiny app and I need to make sure the end users won't accidentally close a bsModal, because there are some action buttons on it. I've done some research and learned I need to overwrite backdrop and keyboard parameters, but even though I've seen some suggestions, I have no idea where exactly this needs to sit in my code. I am not proficient with JavaScript and very new to Shiny, so even though it feels like a simple task, I cannot get this right.

In case anyone needs it, here's a bit of dummy code that opens a modal window after a button press; I need to prevent people from closing it by accidentally clicking in the background or hitting esc.

    library(shiny)
    library(shinyBS)

    ui <- fluidPage(

      sidebarLayout(

        sidebarPanel(
            actionButton("go", "Go")
            ,bsModal("window", "Window", "go"
                    ,textOutput("print"))
          )
        ,mainPanel()
      )

    )

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

      output$print = renderText("This is a test")

    }

    shinyApp(ui, server)

I tried to combine the solutions provided in these two threads:

Is there a way to hide/disable the `Close` button on a `bsModal` window?

Prevent Bootstrap Modal from disappearing when clicking outside or pressing escape?

to do something like this (in a few different combinations), but that didn't really work:

            actionButton("go", "Go")
            ,bsModal("window", "Window", "go"
                    ,textOutput("print")
                    ,tags$head(tags$style("#window .modal{backdrop: 'static'}")))
          )

Any help would be really appreciated!

回答1:

This will do it:

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

And then you can close the header and footer as well, to prevent closing there:

bsModalNoClose("window", "Window", "go"
               ,textOutput("print"),
               tags$head(tags$style("#window .modal-footer{display:none}
                                             .modal-header{display:none}")))

来源：https://stackoverflow.com/questions/50368690/change-backdrop-for-a-bsmodal-in-shiny-app

标签

Shiny

shinybs