ShinyApp - Dynamically Add/Remove UI Elements

DESCRIPTION

Title: Dynamically Remove UI Elements
Author: [email protected]
DisplayMode: Showcase
Type: Shiny

server.R

library(shiny)

removeMeButton <- function(id, label = paste0("Remove Me, I am ", id)) {
  actionButton(paste0("rmBtn", id), label = label)
}

shinyServer(function(input, output) {
  container <- reactiveValues(uiComponents = list())
  
  output$container <- renderUI({
    container$uiComponents
  })
  
  observe({
    if(is.null(input$addBtn) || input$addBtn == 0) return()
    
    isolate({
      uiComponentCount <- length(container$uiComponents)
      container$uiComponents <- append(
        container$uiComponents, 
        list(
          list(
            "removeBtn" = removeMeButton(id = as.integer(runif(1,1e5,1e6-1))),
            br(),br()
          )
        )
      )
    })
  })
  
  observe({
    if(length(container$uiComponents) == 0) return()
    rmBtns <- lapply(container$uiComponents, `[[`, "removeBtn")
    rmBtnIds <- sapply(container$uiComponents, function(uiCom) {
      uiCom$removeBtn$attribs$id
    })
    rmBtnVals <- sapply(rmBtnIds, function(btnId) input[[btnId]])
    if(any(sapply(rmBtnVals, is.null))) return()
    if(all(rmBtnVals == 0)) return()
    isolate({
      container$uiComponents[[which(rmBtnVals > 0)]] <- NULL
    })
  })
  
})

ui.R

library(shiny)

shinyUI(fluidPage(
  titlePanel("Dynamically Add/Remove UI Elements"),
  hr(),
  actionButton("addBtn", "Add"),
  br(),br(),
  uiOutput("container")
))

I'm not sure there is any point to isolate line https://gist.github.com/beader/bbf2221ab6f84a819c0f#file-server-r-L41 if you use container$uiComponents above without isolation. I would recommend using observeEvent() instead of observe() for more clear isolation description as a replacement for the first observe() and removing isolations in the second observe because it is misleading.

Hi @beader @grayskripko I've tested your example with a selectInput() and the selection made to the previously added selectInput() is reset each time a new input is added. Have you found a way to implement the above (adding new inputs) while retaining the selected value in the existing selectInput(). Note: I am unable to use insertUI() and removeUI() for my particular use case.

See reprex below:

library(shiny)

# function to render UI element
removeMeButton <- function(id, label = paste0("Remove Me, I am ", id)) {
  actionButton(paste0("rmBtn", id), label = label)
}

dropdownUI <- function(id) {
  selectInput(paste0("dropdown", id), label = NULL, choices = c("A", "B", "C"))
}

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

  container <- reactiveValues(uiComponents = list())
  
  output$container <- renderUI({
    container$uiComponents
  })
  
  observe({
    if(is.null(input$addBtn) || input$addBtn == 0) return()
    
    isolate({
      uiComponentCount <- length(container$uiComponents)
      container$uiComponents <- append(
        container$uiComponents, 
        list(
          list(
            "removeBtn" = removeMeButton(id = as.integer(runif(1,1e5,1e6-1))),
            "dropdownSelection" = dropdownUI(id = as.integer(runif(1,1e5,1e6-1))),
            br(),br()
          )
        )
      )
    })
  })
  
  observe({
    if(length(container$uiComponents) == 0) return()
    rmBtns <- lapply(container$uiComponents, `[[`, "removeBtn")
    rmBtnIds <- sapply(container$uiComponents, function(uiCom) {
      uiCom$removeBtn$attribs$id
    })
    rmBtnVals <- sapply(rmBtnIds, function(btnId) input[[btnId]])
    if(any(sapply(rmBtnVals, is.null))) return()
    if(all(rmBtnVals == 0)) return()
    isolate({
      container$uiComponents[[which(rmBtnVals > 0)]] <- NULL
    })
  })
  
}


ui <- fluidPage(
  titlePanel("Dynamically Add/Remove UI Elements"),
  hr(),
  actionButton("addBtn", "Add"),
  br(),br(),
  uiOutput("container")
)

shinyApp(ui, server)

Hi @jameswcraig
I think I have totally forgot what I have written almost 6 years ago.
BTW, I think Python Voila project can do a better job for writing "tiny" data analysis web applications.
I am sorry I can't help.