首页 > 解决方案 > 在 Shiny 中创建多个内联输入组

问题描述

我想内联几组输入,我不知道提前多少。我已经看到了所有类似的问题,但没有任何帮助。我的代码是这样的:

library(shiny)

ui <- fluidPage(
    tags$head(
        tags$style(type="text/css", ".inline label{ display: table-cell; text-align: left; vertical-align: middle; } 
                   .inline .form-group{display: table-row;}")
        ),
    uiOutput("out")
)

server <- function(input, output){
    set.seed(1543)
    num <- 1:runif(1, 1, 6)

    show <- function(i){
        tagList(
            numericInput(i, paste(c(1:i), collapse = ""), value = 0),
            selectInput(paste("text", i), "", choices = c("min", "max"))
        )
    }

    output$out <- renderUI({
        tags$div(class = "inline", 
                 lapply(num, function (i) {
                     show(i)
                 })
        )
    })
}

shinyApp(ui = ui, server = server)

所以当“num”是随机的时,我试图为每个“num”做两个输入。但是 selectInput 出现在新行中。

如何为每个数字制作一行(label-numericInput-selectInput)?注意:每行的标签可以有不同的长度,所以盒子应该右对齐。

提前非常感谢!

标签: rshiny

解决方案


最简单的方法是style = "display: inline-block;vertical-align:top;"在输入中添加并在最后添加断线。

library(shiny)

ui <- fluidPage(
  tags$head(
    tags$style(type="text/css", ".inline label{ display: table-cell; text-align: left; vertical-align: middle; } 
                   .inline .form-group{display: table-row;}")
  ),
  uiOutput("out")
)

server <- function(input, output){
  set.seed(1543)
  num <- 1:runif(1, 1, 6)

  show <- function(i){
    tagList(
      div(numericInput(i, paste(i), value = 0), style = "display: inline-block;vertical-align:top;"),
      div(selectInput(paste("text", i), "", choices = c("min", "max")), style = "display: inline-block;vertical-align:top;"),
      br()
    )
  }

  output$out <- renderUI({
    tags$div(class = "inline", 
             lapply(num, function (i) {
               show(i)
             })
    )
  })
}

shinyApp(ui = ui, server = server)

推荐阅读