| shinyalert {shinyalert} | R Documentation |
A modal can contain text, images, OK/Cancel buttons, an input to get a
response from the user, and many more customizable options. The value of the
modal can be retrieved in Shiny using input$shinyalert or using the
two callback parameters. See the
demo Shiny app
online for examples or read the
full README.
shinyalert must be initialized with a call to
useShinyalert in the app's UI.
shinyalert(title = "", text = "", type = "", closeOnEsc = TRUE, closeOnClickOutside = FALSE, html = FALSE, showCancelButton = FALSE, showConfirmButton = TRUE, inputType = "text", inputValue = "", inputPlaceholder = "", confirmButtonText = "OK", confirmButtonCol = "#AEDEF4", cancelButtonText = "Cancel", timer = 0, animation = TRUE, imageUrl = NULL, imageWidth = 100, imageHeight = 100, className = "", callbackR = NULL, callbackJS = NULL)
title |
The title of the modal. |
text |
The modal's text. |
type |
The type of the modal. There are 4 built-in types which will show
a corresponding icon: |
closeOnEsc |
If |
closeOnClickOutside |
If |
html |
If |
showCancelButton |
If |
showConfirmButton |
If |
inputType |
When using |
inputValue |
When using |
inputPlaceholder |
When using |
confirmButtonText |
The text in the "OK" button. |
confirmButtonCol |
The background colour of the "OK" button (must be a HEX value). |
cancelButtonText |
The text in the "Cancel" button. |
timer |
The amount of time (in milliseconds) before the modal should
close automatically. Use |
animation |
If |
imageUrl |
Add a custom icon to the modal. |
imageWidth |
Width of the custom image icon, in pixels. |
imageHeight |
Height of the custom image icon, in pixels. |
className |
A custom CSS class name for the modal's container. |
callbackR |
An R function to call when the modal exits. See the 'Modal return value' and 'Callbacks' sections below. |
callbackJS |
A JavaScript function to call when the modal exits. See the 'Modal return value' and 'Callbacks' sections below. |
Usually the purpose of a modal is simply informative, to show some
information to the user. However, the modal can also be used to retrieve an
input from the user by setting the type = "input" parameter.
Only a single input can be used inside a modal. By default, the input will be
a text input, but you can use other HTML input types by specifying the
inputType parameter. For example, inputType = "number" will
provide the user with a numeric input in the modal.
See the 'Modal return value' and 'Callbacks' sections below for information on how to access the value entered by the user.
Modals created with shinyalert have a return value when they exit.
When there is an input field in the modal (type="input"), the value of
the modal is the value the user entered. When there is no input field in the
modal, the value of the modal is TRUE if the user clicked the "OK"
button, and FALSE if the user clicked the "Cancel" button.
When the user exits the modal using the Escape key or by clicking outside of
the modal, the return value is FALSE (as if the "Cancel" button was
clicked). If the timer parameter is used and the modal closes
automatically as a result of the timer, no value is returned from the modal.
The return value of the modal can be accessed via input$shinyalert in
the Shiny server's code, as if it were a regular Shiny input. The return
value can also be accessed using the modal callbacks (see below).
The return value of the modal is passed as an argument to the callbackR
and callbackJS functions (if a callbackR or callbackJS
arguments are provided). These are functions that get called, either in R or
in JavaScript, when the modal exits.
For example, using the following shinyalert code will result in a
modal with an input field. After the user clicks "OK", a hello message will
be printed to both the R console and in a native JavaScript alert box. You
don't need to provide both callback functions, but in this example both are
used for demonstration.
shinyalert(
"Enter your name", type = "input",
callbackR = function(x) { message("Hello ", x) },
callbackJS = "function(x) { alert('Hello ' + x); }"
)
Notice that the callbackR function accepts R code, while the
callbackJS function uses JavaScript code.
Since closing the modal with the Escape key results in a return value of
FALSE, the callback functions can be modified to not print hello in
that case.
shinyalert(
"Enter your name", type = "input",
callbackR = function(x) { if(x != FALSE) message("Hello ", x) },
callbackJS = "function(x) { if (x !== false) { alert('Hello ' + x); } }"
)
if (interactive()) {
library(shiny)
library(shinyalert)
shinyApp(
ui = fluidPage(
useShinyalert(), # Set up shinyalert
actionButton("btn", "Click me")
),
server = function(input, output) {
observeEvent(input$btn, {
# Show a simple modal
shinyalert(title = "You did it!", type = "success")
})
}
)
}