Używanie klawisza Enter z przyciskiem czynności w R Shiny

Question

Próbuję napisać funkcję javascript, aby rozszerzyć R błyszczące action button demo. Chciałbym, aby użytkownik mógł wprowadzić numer przez kliknięcie przycisku akcji i naciśnięcie klawisza Enter po wybraniu formularza wprowadzania liczb. Kod dla ui.R jest:

shinyUI(pageWithSidebar(
    headerPanel("actionButton test"), 
    sidebarPanel(
    tags$head(tags$script(src = "enter_button.js")), 
    numericInput("number", "N:", min = 0, max = 100, value = 50), 
    br(), 
    actionButton("goButton", "Go!"), 
    p("Click the button to update the value displayed in the main panel.") 
), 
    mainPanel(
    verbatimTextOutput("nText") 
) 
)) 

i server.R:

shinyServer(function(input, output) { 
ntext <- eventReactive(input$goButton, { 
    input$number 
    }) 

    output$nText <- renderText({ 
    paste(ntext(), input$goButton) 
    }) 
}) 

I obejmował następujące JavaScript w pliku o nazwie enter_button.js obrębie www/folderu:

$("#number").keyup(function(event){ 
    if(event.keyCode == 13){ 
     $("#goButton").click(); 
    } 
}); 

Jednak po uruchomieniu aplikacji wybierz numer formularza wejściowego i naciśnij klawisz Enter, aby przycisk akcji nie został zwiększony, ale po kliknięciu zwiększa się. Alternatywnie, ja też testowane tylko uderzanie wprowadzić w dowolnym miejscu w dokumencie z:

$(document).keyup(function(event){ 
    if(event.keyCode == 13){ 
     $("#goButton").click(); 
    } 
}); 

i że pracował, więc moje podejrzenie, że jQuery nie może znaleźć element #NUMBER. Z góry dziękuję!

Answer 1

byłem w stanie dowiedzieć się tego za pomocą funkcji jQuery is(":focus") kod Kiedyś było:

$(document).keyup(function(event) { 
    if ($("#number").is(":focus") && (event.keyCode == 13)) { 
     $("#goButton").click(); 
    } 
}); 

Answer 2

Oto mój najlepszym rozwiązaniem. Naprawdę nie podoba mi się to, ale przynajmniej działa.

library(shiny) 
# This is a demo app to test a key binding on an actionButton 
# Uncommenting the info item (on both UI and server) will display internal stuff 
runApp( 
    list(
    ############################################# 
    # UI 
    ############################################# 
    ui = bootstrapPage(
     textInput ("myinput", label = "Write something here"), 
     tags$script(' 
     $(document).on("keydown", function (e) { 
     Shiny.onInputChange("lastkeypresscode", e.keyCode); 
     }); 
     '), 
     actionButton("GO", "Lancer le matching !"), 
     # verbatimTextOutput("info"), 
     verbatimTextOutput("results") 
    ), 

    ############################################# 
    # SERVER 
    ############################################# 
    server = function(input, output, session) { 

     # There are state variables for the input text and GO button 
     curr.val <- "" # Corresponds to the current displayed input$myinput 
     curr.go <- 0 # Corresponds to the last known GO value (integer) 

     lastEvent <- reactive({ 
     # Is reactive to the following events 
     input$GO 
     input$lastkeypresscode 

     # Decide which action should be taken 
     if(input$GO > curr.go) { 
      # The user pushed the GO actionButton, so take action 
      action <- 1 
      curr.go <<- input$GO 
     } else if(input$lastkeypresscode == 13) { 
      # The user pressed the Enter key, so take action 
      action <- 1 
     } else { 
      # The user did anything else, so do nothing 
      action <- 0 
     } 

     return(action) 
     }) 

     output$results = renderPrint({ 
     if(lastEvent() == 1) { 
      curr.val <<- isolate(input$myinput) 
     } 
     curr.val 
     }) 

     # output$info = renderText({ 
     # paste(curr.val, curr.go, input$lastkeypresscode, sep = ", ") 
     # }) 
    } 
) 
)