2015-09-01 17 views
13

Sto provando a scrivere una funzione javascript per estendere l'R lucido action button demo. Vorrei che l'utente fosse in grado di inserire un numero facendo clic sul pulsante di azione e premendo Invio quando hanno selezionato il modulo di immissione del numero. Il codice per ui.R è:Utilizzo tasto invio con pulsante azione in R lucido

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") 
) 
)) 

e server.R:

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

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

ho inserito il seguente JavaScript in un file chiamato enter_button.js all'interno della www/cartella:

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

Tuttavia, quando eseguo l'app, selezionare il modulo di immissione del numero e premere invio il pulsante di azione non viene incrementato, ma viene incrementato se si fa clic su di esso. In alternativa, ho anche provato semplicemente premendo entrare in qualsiasi punto del documento con:

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

e che ha funzionato, quindi il mio sospetto è che il jQuery non riesce a trovare l'elemento #NUMBER. Grazie in anticipo!

risposta

16

ero in grado di capire questo utilizzando la funzione di jQuery is(":focus"), il codice che ho usato è stato:

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

Qui è la mia soluzione migliore. Non mi piace davvero, ma almeno funziona.

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 = ", ") 
     # }) 
    } 
) 
) 
Problemi correlati