选择显示所有项目的下拉列表答案

【问题标题】：Selectize dropdown showing all items选择显示所有项目的下拉列表
【发布时间】：2018-04-05 00:17:21
【问题描述】：

我有一个无法解决的小问题。我想这个解决方案很简单，而且我对 java 语言的了解不多。这是一个小例子：

library(shiny)

ui <- (fluidPage(
  sidebarLayout(
    sidebarPanel(
      selectInput("userInput","Select User", c(1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21),
                  selected=1),
      selectInput("LongInput", "Long Strings", c("This is a long long string that is long.",
                                                 "This is a long long string that is longer."))
    ),

    # allows for long texts to not be wrapped, and sets width of drop-down
    tags$head(
      tags$style(HTML('
                      .selectize-input {
                      white-space: nowrap;
                      }
                      #LongInput + div>.selectize-dropdown{
                      width: 660px !important;
                      }
                      #userInput + div>.selectize-dropdown{
                                            width: 357px !important; maxItems: 21;
                      }
                      '
              )
      )
      )
      )
      ))

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

shinyApp(ui, server)

当用户单击第一个 selectInput 以做出选择时，我不想显示列表的前七个元素，而是显示列表的所有元素。谢谢。

【问题讨论】：

java !=javascript

标签： java css shiny dropdown selectize.js

【解决方案1】：

我认为shinyWidgets 包是你需要的。它有一个pickerInput，它将显示所有选项

#install.packages("shinyWidgets")
library(shiny)
library(shinyWidgets)

ui <- fluidPage(
  sidebarLayout(
    sidebarPanel(
      pickerInput("userInput", label = "Select User", choices = 1:21, options = list(style = "btn-primary")),
      selectInput("LongInput", "Long Strings", c("This is a long long string that is long.",
                                                 "This is a long long string that is longer."))
    ),mainPanel()
  )
)

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

shinyApp(ui, server)

【讨论】：

【解决方案2】：

你可以使用 css tags$style(type='text/css', ".selectize-dropdown-content {max-height: 1000px !important; }") 来做到这一点

类似这样的：

ui <- (fluidPage(
  tags$style(type='text/css', ".selectize-dropdown-content {max-height: 1000px !important; }"), 
  sidebarLayout(
    sidebarPanel(
      selectInput("userInput","Select User", c(1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21),
                  selected=1),
      selectInput("LongInput", "Long Strings", c("This is a long long string that is long.",
                                                 "This is a long long string that is longer."))
    ),


    # allows for long texts to not be wrapped, and sets width of drop-down
    tags$head(
      tags$style(HTML('
                      .selectize-input {
                      white-space: nowrap;
                      }
                      #LongInput + div>.selectize-dropdown{
                      width: 660px !important;
   }
                      #userInput + div>.selectize-dropdown{
                      width: 357px !important; maxItems: 21;
                      }
                      '
      )
      )
      )
      )
      ))

你得到：

【讨论】：

酷！这对我也很有效！祝 SBista 愉快。