Show/hide 基于 numericInput 和 actionButton 的输入

Question

闪亮的应用程序具有以下元素：

一个 numericInput 值介于 0 和 3 之间的字段
一个 uiOutput 其中包含三个隐藏的 textInput 字段
一个actionButton

我想要实现的是 show 单击按钮后隐藏的 textInput 字段。显示的字段数量取决于 numericInput 中 select 的数量。下面的 完整功能代码 成功地做到了这一点；但是，有一个问题我似乎无法找到解决方案。例如，如果我 select 3 并单击按钮，则会出现 3 个隐藏的 textInput 字段（耶！），但是如果我立即 select 一个低于 3 并单击按钮，不需要的字段仍然存在。我怎样才能做到这一点？谢谢

library(shiny)
library(shinyjs)

ui <- fluidPage(

  useShinyjs(),

  numericInput(inputId = "num", label = "How many inputs do you want to show?", value = 1, min = 1, max = 3),

  uiOutput(outputId = "out"),

  actionButton(inputId = "go", label = "Click me!")
)

server <- function(input, output){

  output$out <- renderUI({
    numinputs <- lapply(1:3, function(i){
      textInput(inputId = paste0("txt", i), label = paste0("Text input ", i))
    })
    shinyjs::hidden(numinputs)
  })

  observeEvent(eventExpr = input$go, handlerExpr = {
    for(i in seq(input$num)){
      shinyjs::show(id = paste0("txt", i))
    }
  })
}

shinyApp(ui = ui, server = server)

Answer 1

我已经修改了您的代码以完全按照您的要求进行操作。

library(shiny)
library(shinyjs)

ui <- fluidPage(

  useShinyjs(),

  numericInput(inputId = "num", label = "How many inputs do you want to show?", value = 1, min = 1, max = 3),

  uiOutput(outputId = "out"),

  actionButton(inputId = "go", label = "Click me!")
)

server <- function(input, output){
  nout <- 0

  output$out <- renderUI({
    numinputs <- lapply(1:3, function(i){
      textInput(inputId = paste0("txt", i), label = paste0("Text input ", i))
    })
    shinyjs::hidden(numinputs)
  })

  observeEvent(eventExpr = input$go, handlerExpr = {


      if(nout > input$num){ # If the current no. of inputs is less than previous hide the inputs
        for(i in nout:(nout-as.numeric(input$num))){
          shinyjs::hide(id = paste0("txt", i)) 
        } 

      }else{
        for(i in seq(input$num)){
        shinyjs::show(id = paste0("txt", i)) 
      }

    }

    nout <<- input$num
  })
}

shinyApp(ui = ui, server = server)

希望对您有所帮助！

Answer 2

此代码类似于@SBista 的代码，但没有 nout 变量。

library(shiny)
library(shinyjs)

ui <- fluidPage(
    
    useShinyjs(),
    
    numericInput(inputId = "num", label = "How many inputs do you want to show?", value = 1, min = 1, max = 3),
    
    uiOutput(outputId = "out"),
    
    actionButton(inputId = "go", label = "Click me!")
)

server <- function(input, output){
    output$out <- renderUI({
        numinputs <- lapply(1:3, function(i){
            textInput(inputId = paste0("txt", i), label = paste0("Text input ", i))
        })
        shinyjs::hidden(numinputs)
    })
    
    observeEvent(eventExpr = input$go, handlerExpr = {
        n <- seq(length.out = as.numeric(input$num))
        lapply(seq(3), function(i) {
            if(i %in% n) {
                shinyjs::show(id = paste0("txt", i))
            } else{
                shinyjs::hide(id = paste0("txt", i))
            }
        })
    })
}

shinyApp(ui = ui, server = server)

#edit - 没有 shinyjs/dinamically 创建

# if you comment the lines marked with # no-button
# the app will change the number of textInputs as soon as you change the numericInput
library(shiny)

ui <- fluidPage(
    numericInput(inputId = "num", label = "How many inputs do you want to show?", value = 1, min = 1, max = 3),
    uiOutput(outputId = "out"),
    actionButton(inputId = "go", label = "Click me!") # no-button
)

server <- function(input, output){
    output$out <- renderUI({
        input$go # no-button
        isolate( # no-button
            numinputs <- lapply(seq(length.out = req(input$num)), function(i){
                textInput(inputId = paste0("txt", i), label = paste0("Text input ", i))
            })
        ) # no-button
    })
}

shinyApp(ui = ui, server = server)

Show/hide 基于 numericInput 和 actionButton 的输入

Show/hide inputs based on numericInput and actionButton

r

shiny

shinyjs

#edit - 没有 shinyjs/dinamically 创建