javascript – How to use Tooltip with virtualSelectInput in R Shiny to show filter values if text is long and hidden by ellipsis


I’ve a R shiny application in which I am using virtualSelectInput to show list of values for my filter. But some of my text values are long and the dropbox hides them by ellipsis(…).

I see that the Virtual Select documentation mentions using Tooltip for displaying these long values while hovering cursor during value selection. But I couldn’t figure out a way to use it in R Shiny.

I also found that R shiny has another function called tooltipOptions from same shinyWidgets library to show tooltip for a dropdown menu button. But again, there isn’t any usage example.

I tried using it in below form through a dummy shiny app –

library(shiny)
library(shinyWidgets)

options <- c(
  "This is short text",
  "This is a longer text",
  "This is a very very very very long text",
  "This is a super ultra pro max very very very very long text"
)

ui <- fluidPage(
  titlePanel("Virtual Select Input Example"),
  
  virtualSelectInput("selected_option", "Select Digital Thread:", choices = options, 
                     multiple = TRUE, search = TRUE, searchNormalize = TRUE, position = "auto", dropboxWidth = "250px", 
                     showSelectedOptionsFirst = TRUE, placeholder = "All", markSearchResults = TRUE, selectAllOnlyVisible = TRUE,
                     tooltipOptions = tooltipOptions(placement = "right", title = "Params", html = FALSE)),
  
  textOutput("selected_value")
)

server <- function(input, output, session) {
  output$selected_value <- renderText({
    paste("You selected:", input$selected_option)
  })
}

shinyApp(ui, server)

But it doesn’t work. I know I am not correctly using these together, so I would appreciate if someone can guide on using it either through this or any other simple way.
I am not very inclined towards using a custom css or js code because in my real application I have Virtual Select at almost 100 different places.



Source link

Leave a Comment