modal: Modal dialogs

Description

Modals are a flexible alert window, which disable interaction with the page behind them. Modals may include inputs or buttons or simply text. To use one or more modals you must first register the modal from the server with registerModal(). This will assocaite the modal with an id at which point the rest of your application's server may hide or show the modal with showModal() and hideModal(), respectively, by referring to this id.

Usage

modal(title = NULL, body = NULL, footer = NULL, ...,
  center = FALSE, size = NULL)
registerModal(id, modal, session = getDefaultReactiveDomain())
showModal(id, exprs = list(), session = getDefaultReactiveDomain())
hideModal(id, session = getDefaultReactiveDomain())

Arguments

title

A character string or tag element specifying the title of the modal.

body

A character string or tag element specifying the body of the modal.

footer

A character string or tag element specifying the footer of the modal.

...

Additional named arguments passed as HTML attributes to the parent element.

center

One of TRUE or FALSE specifying whether the modal is vertically centered on the page, defaults to FALSE.

size

One of "small", "large", or "xl" (extra large) specifying whether to shrink or grow the width of the modal, defaults to NULL, in which case the width is not adjusted.

A character string specifying the id to associate with the modal.

modal

A modal tag element created using modal().

session

A reactive context, defaults to getDefaultReactiveDomain().

exprs

A list of named values used to interpolate placeholders in a registered modal, defaults to list().

Example application

ui <- container(
  buttonInput(
    id = "trigger",
    "Open modal",
    icon("plus")
  )
)
server <- function(input, output) {
  isolate(
    registerModal(
      id = "modal1",
      modal(
        title = "A simple modal",
        body = paste(
          "Cras mattis consectetur purus sit amet fermentum.",
          "Cras justo odio, dapibus ac facilisis in, egestas",
          "eget quam. Morbi leo risus, porta ac consectetur",
          "ac, vestibulum at eros."
        )
      )
    )
  )
observeEvent(input$trigger, ignoreInit = TRUE, {
    showModal("modal1")
  })
}
shinyApp(ui, server)

Examples

Run this code

# NOT RUN {
### Simple modal

modal(
  title = "Title",
  body = "Cras placerat accumsan nulla.",
  footer = buttonInput(
    id = "closeModal",
    label = "Close"
  ) %>%
    background("blue")
)

### Modal with container body

modal(
  size = "large",
  title = "More complex",
  body = container(
    columns(
      column("Cras placerat accumsan nulla."),
      column("Curabitur lacinia pulvinar nibh."),
      column(
        "Aliquam posuere.",
        "Praesent fermentum tempor tellus."
      )
    )
  )
)

# }

Run the code above in your browser using DataLab

Last chance! 50% off unlimited learning