daattali / shinyalert

🗯️ Easily create pretty popup messages (modals) in Shiny
https://daattali.com/shiny/shinyalert-demo/
Other
241 stars 26 forks source link

Validate user input for `type = "input"` #45

Closed JamesBrownSEAMS closed 3 years ago

JamesBrownSEAMS commented 3 years ago

I have a requirement for a new app I am working on and I can't find a way to implment it after reading the docs, I was hoping someone could tell me if it is possible:

Basically, I need to restrict inputs a user can supply. Being able to set the inputType = "number" is helpful in this case as I don't need to validate against non-numeric values, but I would also need to limit the range of allowed values. In one case I am asking the user to supply a year so something like upper and lower limits would work (e.g. 1990 <= input <= 2020).

Is something like this possible?

daattali commented 3 years ago

As of last month, if you download the latest CRAN version of the package, you can use any shiny input in the alert (so for this you'd use numericInput or sliderInput). Look at the new documentation.

JamesBrownSEAMS commented 3 years ago

Thanks for the information, I had not seen the update to the package and the new features are a great enhancement to the package. I put together a very simple test case to explore the new features:

library(shiny)
library(shinyalert)

ui <- fluidPage(
  useShinyalert(),

  tags$h2("Demo shinyalert"),
  tags$br(),
  fluidRow(
    column(
      width = 6,
      actionButton("shinyalert_popup",
                   "Alert Popup")
    )
  ),
  fluidRow(
    verbatimTextOutput(outputId = "return_value")
  )
)

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

  observeEvent(input$shinyalert_popup, {
    shinyalert(
      title = "Input control",
      text = tagList(
        numericInput(inputId = "shinyalert_value",
                     label = "",
                     value = 5,
                     min = 0,
                     max = 10,
                     step = 1)
      ),
      html = TRUE,
      inputId = "shinyalert_modal",
      showConfirmButton = TRUE,
      confirmButtonText = "OK"
    )
  })

  output$return_value <- renderPrint(input$shinyalert_value)
}

shinyApp(ui = ui, server = server)

It appears that the min/max values are respected when using the up/down controls on the right side of the input (Chrome and FF, they do not appear in Edge or IE) but in all cases I can still type "100" (for example) into the input and it is accepted when pressing the ConfirmButton. I will need to find out how to add more validation to the numericInput control itself or consider using the sliderInput control instead. I do not consider this an issue with shinyalert or the modal it creates so I'll close this case.

daattali commented 3 years ago

That behaviour will be seen with numeric inputs because the browser doesn't really validate numeric inputs too strictly. You're right it had nothing to do with shinyalert, it'll happen in any context.

On Mon., Dec. 14, 2020, 05:08 JamesBrownSEAMS, notifications@github.com wrote:

Thanks for the information, I had not seen the update to the package and the new features are a great enhancement to the package. I put together a very simple test case to explore the new features:

library(shiny) library(shinyalert)

ui <- fluidPage( useShinyalert(),

tags$h2("Demo shinyalert"), tags$br(), fluidRow( column( width = 6, actionButton("shinyalert_popup", "Alert Popup") ) ), fluidRow( verbatimTextOutput(outputId = "return_value") ) )

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

observeEvent(input$shinyalert_popup, { shinyalert( title = "Input control", text = tagList( numericInput(inputId = "shinyalert_value", label = "", value = 5, min = 0, max = 10, step = 1) ), html = TRUE, inputId = "shinyalert_modal", showConfirmButton = TRUE, confirmButtonText = "OK" ) })

output$return_value <- renderPrint(input$shinyalert_value) }

shinyApp(ui = ui, server = server)

It appears that the min/max values are respected when using the up/down controls on the right side of the input (Chrome and FF, they do not appear in Edge or IE) but in all cases I can still type "100" (for example) into the input and it is accepted when pressing the ConfirmButton. I will need to find out how to add more validation to the numericInput control itself or consider using the sliderInput control instead. I do not consider this an issue with shinyalert or the modal it creates so I'll close this case.

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/daattali/shinyalert/issues/45#issuecomment-744331969, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAHIQFHV45WRS3VV3IPLHBTSUXP2BANCNFSM4UWYIKBA .