How to set the focus to the first row first column cell in a rhandsontable in an RShiny app?

Question

I need to set focus on the first-row first-column cell of a rhandsontable in an RShiny app. Looking for a solution similar to the solutions discussed in this forum: Set the focus to a specific datagrid cell, QML: Set focus TextInput in a table cell, how to focus a table cell using javascript?, want to put the focus and edit the first cell of my dynamic table, etc. I need help with the renderer function to accomplish this.

library(shiny)
library(rhandsontable)

DF = data.frame(matrix(data = '', nrow = 5, ncol = 1, dimnames = list(seq(1:5),c("Barcode"))))

ui <- fluidPage(
  titlePanel("Scan Sample Barcode"),
  mainPanel(
    rHandsontableOutput("scanBarcode")
  )
  
)
server <- function(input, output) {
  output$scanBarcode <- renderRHandsontable(rhandsontable(DF) %>%
                                              hot_cols(renderer = "function(instance, td, row, col, prop, value, cellProperties) 
                                                {Handsontable.TextCell.renderer.apply(this, arguments);
                                                if (col == 0 & row == 0 ) {td.focus();}")
                                           )
}

shinyApp(ui = ui, server = server)

Answer 1

How about his:

library(htmlwidgets)

server <- function(input, output) {
  output$scanBarcode <- renderRHandsontable(
    rhandsontable(DF) %>% 
    onRender("function(el, x) { 
                 let hot = this.hot;
                 hot.selectCell(0, 0); 
                 hot.getActiveEditor().beginEditing();
             }")  
  )
}

You use the handsontable API to select the cell (N.B. indices are zero based in JS) and then invoke the cell editor.

You place this JS code in the onRender function where you have a reference of the handsontable object being created.