Focus on selectInput using keyboard shortcut key

Question

I am looking for a way to bring focus on selectInput when the user clicks on key 'q'. Can someone show me how to modify the code below?

Right now, clicking on key q increments the counter in text by 1.

library(shiny)

runApp(shinyApp(
  ui = fluidPage(
    tags$script(HTML("$(function(){ 
      $(document).keyup(function(e) {
      if (e.which == 81) {
        $('#button').click()
      }
      });
      })")),
    actionButton("button", "An action button"),
    selectInput("inputBox", "Select something", choices = c("A","B","C"), selected = "B"),
    textOutput("text")),
  server=function(input, output, session) {
    output$text <- renderText({input$button})
  }
))

Stéphane Laurent · Accepted Answer · 2022-01-08T12:41:15.050

3

Use this script:

tags$script(HTML("$(function(){ 
  $(document).keyup(function(e) {
    if(e.which == 81){
      var selectized = $('#inputBox').selectize();
      selectized[0].selectize.focus();
    }
  });
})")),

edited Jan 08 '22 at 12:41

answered Jan 08 '22 at 12:19

Stéphane Laurent

75,186
15
119
225

Thanks, Stephane. Is it possible to select the contents in inputBox while bringing focus on this control? – Saurabh Jan 08 '22 at 15:36
To select contents in selectInput, I tried - ```selectized[0].selectize.focus( function() { $(this).select(); } );```, but this not worked too. – Saurabh Jan 08 '22 at 20:51
Following worked - ```selectized[0].selectize.focus(); selectized[0].selectize.clear();``` – Saurabh Jan 08 '22 at 21:21

Focus on selectInput using keyboard shortcut key

1 Answers1