selectInput size

shiny
1

Hello!

Is there a way to limit the expansion of the input box when using the selectInput function? I am trying to avoid from the following:

image
image309×891 17.3 KB

Thank you in advance!
Rami

2

Do you mean you want to only allow a maximum of N items to be chosen? Or are you literally trying to just limit the height of the box?

If it's the former, you can use options = list(maxItems = N) if you use selectizeInput(). Example:

library(shiny)

ui <- fluidPage(
  selectizeInput("select", "Select", letters, options = list(maxItems = 3))
)

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

shinyApp(ui, server)
1 Like
3

Dean thank you for the quick response, I am trying to limit the size of the of the box (or just prevent it form expansion) without limit the number of items to be selected.

4

I suppose you can use CSS to limit the height. It might cause some weird interactions with the box, I haven't really tested it for longer than 10 seconds, but it might work for you.

library(shiny)

mycss <- "
#select ~ .selectize-control .selectize-input {
  max-height: 100px;
  overflow-y: auto;
}
"

ui <- fluidPage(
  tags$style(mycss),
  selectInput("select", "Select", rownames(mtcars), multiple = TRUE)
)

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

shinyApp(ui, server)

There might be better ways, that's just the first I could think of

2 Likes
5

And you can also control the height of the dropdown content box by adding :

.selectize-dropdown-content {
  max-height: 100px;
  overflow-y: auto;
  background: ghostwhite;
}

to the example above

1 Like
6

Another option would be to turn off selectize (i.e. selectInput('id', 'label', choices, multiple=TRUE, selectize=FALSE)). It doesn't look as pretty, but it does accomplish what you want. See this app for a side by side comparison.

1 Like
7

Thanks a lot for all the answers, really helpful!