ebailey78 / shinyBS

Twitter Bootstrap Components for Shiny
182 stars 47 forks source link

Fast clicks can cause issues with bsModal #128

Open tylerlittlefield opened 4 years ago

tylerlittlefield commented 4 years ago

I have an app that uses bsModal with two actionButton's for canceling and confirming. The actionButtons are observed and toggleModal takes care of the rest. The problem is that if a user double clicks, or clicks multiple times fast enough, we get "stuck" in the modal.

library(shiny)
library(shinyBS)

ui <- fluidPage(
  actionButton("go", "open modal"),
  bsModal("modal", "modal", NULL, actionButton("close", "close modal"))
)

server <- function(input, output, session) {
  observeEvent(input$go, {
    toggleModal(session, "modal", "open")
  })

  observeEvent(input$close, { # <------------- click this close button multiple times, fast
    toggleModal(session, "modal", "close")
  })
}

shinyApp(ui, server)

After some testing, it seems that we can resolve this by disabling the button on click:

library(shiny)
library(shinyBS)

ui <- fluidPage(
  shinyjs::useShinyjs(),
  actionButton("go", "open modal"),
  bsModal("modal", "modal", NULL, actionButton("close", "close modal", onclick="this.disabled=true;this.value='Submitting...'; this.form.submit();"))
)

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

  observeEvent(input$go, {
    shinyjs::enable("close")
    toggleModal(session, "modal", "open")
  })

  observeEvent(input$close, {
    toggleModal(session, "modal", "close")
  })
}

shinyApp(ui, server)

src: https://stackoverflow.com/a/27471389/7362046