how does shiny selectize work?

[woodward]

Hi. I have a linked series of selectInput widgets in my shiny app that work well. I would like to use the selectize option if possible, as it looks more modern. But when I put selectize=TRUE it no longer highlights the default selection and it doesn't react. What do I need to do? Thanks.

library(shiny)
ui <- fluidPage(
	uiOutput("selector"),
	uiOutput("displayer")
)
server <- function(input, output, session){
	output$selector <- renderUI({
		selectInput("mychoice", "Choose some:", choices=c("One", "Two", "Three"), selected=c("One", "Two", "Three"), multiple=TRUE, selectize=FALSE)
	})
	output$displayer <- renderText({
		paste(input$mychoice)
	})

}
shinyApp(ui, server)

[cderv]

By default, from the doc, selectInput is using selectize.js to be rendered - selectize = TRUE is by default in the function.

You set it to FALSE here in your example.

What is exactly the issue ?

The differences between the 2 inputs are illustrated there
https://shiny.rstudio.com/gallery/selectize-vs-select.html

Hope it helps

[woodward]

Yes, but when I put selectize=TRUE it no longer highlights the default selection and it doesn't react. The choices initially appear greyed out instead of highlighted, I can select items, but input$mychoice doesn't change (it consists of all the choices).

[cderv]

When you put selectize = TRUE, the default selected are put inside the box.
By changing to TRUE in your example I got this

This seems to be ok for how selectize.js works.

[woodward]

Yes, but as you can see, it no longer highlights the default selection and it doesn't react. The choices initially appear greyed out instead of highlighted, I can select items, but input$mychoice doesn't change (it consists of all the choices). So it is not working.

[cderv]

I am not sure to see what is the issue. This widget seems for to behave like it says it would.

You have some choices selected by default in the box - it is the ones you put inside the selected argument in your function call

selectInput("mychoice", "Choose some:", choices=c("One", "Two", "Three"), 
selected=c("One", "Two", "Three"), multiple=TRUE, selectize=TRUE

As you provide in selected all the possible choices from choices, there is no more item to select. Everything is selected by default. That is maybe why you have the impression that it does not react. You can't select anything else.

If you do not provide anything in selected, you'll have a blanck box to select one or more item from (multiple = TRUE means you can select more than one)

Example where I selected Two and there still two choices to make

[woodward]

Ok, the penny dropped. It seems that selectize doesn't work like I thought it should. I thought it was a box of options that you could select and deselect, and the selected ones would be the highlighted ones, and you could toggle them on and off. Instead, to deselect you have to highlight one or more items in the box and then click the physical Delete button on the keyboard! (no idea how to do it on a phone) at which point those items return to the ugly drop-down list.

It seems there is a "remove button" plugin that makes it work a bit more like I thought it should. However you still get the ugly drop down list of unselected choices, which obscures a lot of the screen:

https://gist.github.com/pvictor/ee154cc600e82f3ed2ce0a333bc7d015

library(shiny)
ui <- fluidPage(
	uiOutput("selector"),
	uiOutput("displayer")
)
server <- function(input, output, session){
	output$selector <- renderUI({
		# selectInput("mychoice", label="Choose some:", choices=c("One", "Two", "Three"), selected=c("One", "Two", "Three"), multiple=TRUE, selectize=FALSE)
		selectizeInput("mychoice", label="Choose some:", choices=c("One", "Two", "Three"), selected=c("One", "Two", "Three"), multiple=TRUE,
					   options=list(plugins=list("remove_button"), create=TRUE, persist=FALSE))
	})
	output$displayer <- renderText({
		paste(input$mychoice)
	})

}
shinyApp(ui, server)

[woodward]

You can also respond to clicks:

R Shiny selectize selected event