有没有办法在不单击和使用选项卡的情况下替换 textInput 中的文本？

Question

大家好，

我为扫描站创建了一个仪表板，操作员可以在使用条形码扫描仪扫描后观察物品的详细信息。我目前面临的问题是我无法在不点击文本框的情况下扫描商品的条形码。理想情况下，我想做的是：

1. 让操作员无需点击文本框即可直接扫描文本框上的条码。
2. 自动突出显示文本框中的条形码编号，以便扫描下一个条形码编号并呈现第二个项目的详细信息。

可重现的例子：

• ui.R

library(shiny)
library(shinydashboard)
library(shinyBarcode)
library(shinyjs)

dashboardPage(
    dashboardHeader(title = "Barcode System"),
    dashboardSidebar(collapsed = T),
    dashboardBody(
 
        useShinyjs(),
        box(width = 4, height = 880,
            shinyBarcode::includeJsBarcode(cdn = TRUE),
                textInput("barcode_no", h3("Scan Barcode No")),
                shinyBarcode::barcodeOutput("scanned_barcode")
        )))

• server.R

library(shiny)
library(shinydashboard)
library(shinyBarcode)
library(shinyjs)

shinyServer(function(input, output, session) {
# Rendering barcode
    output$scanned_barcode<- shinyBarcode::renderBarcode(
        paste("0",input$barcode_no, sep="") # Need to add "0" to all barcode at the front
    )
})

注意：这里是shinyBarcode的安装方法

# install.packages("devtools")
devtools::install_github("CannaData/shinyBarcode")

如果仍然无法安装，请从Github 下载ZIP file。

接下来，打开 zip 文件并使用以下命令进行安装：

devtools::install("C:\\Users\\dave\\Downloads\\shinyBarcode-master") # Edit to your download directory

预览

Answer 1

设法找到解决方案：

将此添加到我的用户界面中：

library(shiny)
library(shinydashboard)
library(shinyBarcode)
library(shinyjs)

dashboardPage(
    dashboardHeader(title = "Barcode System"),
    dashboardSidebar(collapsed = T),
    dashboardBody(
            # Added JS script
             tags$head(tags$script("Shiny.addCustomMessageHandler('selectText', function(message) {
        $('#barcode_no').select();
      });")),
        useShinyjs(),
        box(width = 4, height = 880,
            shinyBarcode::includeJsBarcode(cdn = TRUE),
                textInput("barcode_no", h3("Scan Barcode No")),
                shinyBarcode::barcodeOutput("scanned_barcode")
        )))

将此添加到服务器中。R

library(shiny)
library(shinydashboard)
library(shinyBarcode)
library(shinyjs)

shinyServer(function(input, output, session) {
# Rendering barcode
    output$scanned_barcode<- shinyBarcode::renderBarcode(
        paste("0",input$barcode_no, sep="") # Need to add "0" to all barcode at the front
    )

observeEvent(input$barcode_no,{
        session$sendCustomMessage("selectText", "select")
    })
})

这解决了 2 个问题：

1. 在启动应用程序时，我们输入条形码编号的唯一方法是单击或使用 Tab。
2. 添加物料编号后，用户需要单击或使用 Tab 键，以突出显示之前的条码编号并替换为第二个条码编号。