Dynamic UI example app for R Shiny

README.md

The user interface components in this example are generated as HTML on the server inside a renderUI() block and sent to the client, which displays them with uiOutput(). Each time a new component is sent to the client, it completely replaces the previous component. This is different from the udpate input demo app, where the value of an existing input component is changed with a command from the server, but the component itself is not replaced with a new one.

DESCRIPTION

Type: Shiny
Title: Dynamic UI
License: MIT
Author: Winston Chang <winston@rstudio.com>
AuthorUrl: http://www.rstudio.com/
Tags: dynamic-ui renderui uioutput
DisplayMode: Showcase

server.R

shinyServer(function(input, output) {

  output$ui <- renderUI({
    if (is.null(input$input_type))
      return()

    # Depending on input$input_type, we'll generate a different
    # UI component and send it to the client.
    switch(input$input_type,
      "slider" = sliderInput("dynamic", "Dynamic",
                             min = 1, max = 20, value = 10),
      "text" = textInput("dynamic", "Dynamic",
                         value = "starting value"),
      "numeric" =  numericInput("dynamic", "Dynamic",
                                value = 12),
      "checkbox" = checkboxInput("dynamic", "Dynamic",
                                 value = TRUE),
      "checkboxGroup" = checkboxGroupInput("dynamic", "Dynamic",
        choices = c("Option 1" = "option1",
                    "Option 2" = "option2"),
        selected = "option2"
      ),
      "radioButtons" = radioButtons("dynamic", "Dynamic",
        choices = c("Option 1" = "option1",
                    "Option 2" = "option2"),
        selected = "option2"
      ),
      "selectInput" = selectInput("dynamic", "Dynamic",
        choices = c("Option 1" = "option1",
                    "Option 2" = "option2"),
        selected = "option2"
      ),
      "selectInput (multi)" = selectInput("dynamic", "Dynamic",
        choices = c("Option 1" = "option1",
                    "Option 2" = "option2"),
        selected = c("option1", "option2"),
        multiple = TRUE
      ),
      "date" = dateInput("dynamic", "Dynamic"),
      "daterange" = dateRangeInput("dynamic", "Dynamic")
    )
  })

  output$input_type_text <- renderText({
    input$input_type
  })

  output$dynamic_value <- renderPrint({
    str(input$dynamic)
  })

})

ui.R

shinyUI(fluidPage(
  titlePanel("Dynamically generated user interface components"),
  fluidRow(

    column(3, wellPanel(
      selectInput("input_type", "Input type",
        c("slider", "text", "numeric", "checkbox",
          "checkboxGroup", "radioButtons", "selectInput",
          "selectInput (multi)", "date", "daterange"
        )
      )
    )),

    column(3, wellPanel(
      # This outputs the dynamic UI component
      uiOutput("ui")
    )),

    column(3,
      tags$p("Input type:"),
      verbatimTextOutput("input_type_text"),
      tags$p("Dynamic input value:"),
      verbatimTextOutput("dynamic_value")
    )
  )
))

Hi Winston,
Thanks for such a nice post. I am facing some issue in dynamic menu dropdown.
I am unable to view the list of file in the dropdown menu depending on the selection of directory form another menu dropdown. Please guide me.

TRY1:

================================

options(shiny.trace=TRUE)

ui <- fluidPage(
titlePanel("test"),
sidebarLayout(
sidebarPanel(selectInput("dir",
label = "dir_id",
choices = (as.list(substr(list.dirs(paste0("D:/BW/test")),start= 12,stop=15)))),

             conditionalPanel(condition = "output.file1 == true",                
             selectInput("file2",textOutput("text1"),choices =textOutput("text1") ))
  ),
   mainPanel(
  uiOutput("text1")
) ) )

server <- function(input, output) {
output$text1 <- renderText({
reactive({
files <- as.list(substr(list.files(paste0("D:/BW/test/",input$dir,"/")),start= 1, stop=1))})
if(is.null(file1)){return()}
observe({updateSelectInput("file1","choose file",choices = files)})
})}

shinyApp(ui,server)

TRY2:

================================

ui <- fluidPage(
titlePanel("test"),
sidebarLayout(
sidebarPanel(
wellPanel(selectInput("Country", "Select a Country:",
uiOutput('text1'))),
wellPanel(selectInput("State", "Select a State:",
uiOutput('text2')))),
mainPanel("")
)
)
server <- function(input, output) {

output$text1 <- renderUI({

observe({
updateSelectInput(session, "Country", choices = reactive({as.list(substr(list.dirs(paste0("D:/BW/test")),start= 12,stop=15))}))}) })

output$text2 <- renderUI({
observe({
files <- as.list(substr(list.files(paste0("D:/BW/test/",input$Country,"/")),start= 1, stop=1))
updateSelectInput(session, "State", choices = files) })
})

shinyApp(ui,server)

Hi,
I am trying to do a similar thing. But instead of cascading dropdown lists, i want to update lists dynamically without a hierarchy.

I am having a little tricky situation. Similar to the above one, yet different.

I have a dataframe of 7 variables. Which can be filtered in 6 different ways.

I have 6 input lists(dropdown menu). By default all of them have a null value selected. When even 1 of the list value is selected then the other 5 lists should show values based on the first selection. if 2 lists are chosen then the options in the other lists will be based on these 2 values and so on.
There is no set priority of which input will be selected first. But whichever list is chosen, all the other lists should reflect values accordingly.

So if i take this sample dataframe
data = data.frame(Year=c("2002","2003","2004","2003","2001","2002", "2001"),
Month = c("Jan", "Feb", "Mar", "Jan", "Dec", "Jan", "Nov"),
Name =c("Sam", "Paul", "James", "Ana","Rose", "Juan", "Tim"),
row.names=NULL, stringsAsFactors = FALSE)
I can choose Month first and select "Jan" the available years should show 2002 & 2003. and the names Sam, Ana & Juan.

Help will be appreciated.

Regards,
Nabeelah

Winston, Can the slider be made to update continuously? I particularly want to generate a manual controlled tour, and as I slide the slider I would like the plot to change incrementally.

The slider for the most part seems to only update once you lift up the mouse button.

It seems that if the slide is long enough it may update a couple of times while dragging it, but its not nearly smooth or frequent enough.