禁用日期范围内的键盘输入闪亮

Posted 2021-04-05

我想做一件简单的事，但我找不到办法做到这一点。我想禁用使用键盘修改日期范围的可能性。如果无法使用键盘修改日期，用户体验会更好。如果你想选择一个10个月之前的日期，你按下键盘上的一个键，那么你回到了当前的月份，这是令人不安的。

这是一个示例代码。

library('shiny')

shinyApp(
  ui = fluidPage(
    fluidRow(
      column(4, 
        dateRangeInput("dates", label = h3("Date range")),
        verbatimTextOutput("datesOut")
      )
    )
  ), 
  server = function(input, output) {
    output$datesOut <- renderPrint({ input$dates })
  }
)

我想让键盘无法修改输入。我看到this question与此相关，但我不知道如何将onkeydown="return false"添加到shiny::daterange()

谢谢

答案

这是我为那些感兴趣的人找到的解决方案。

我只需要添加一些javascript。选择日期后，我也会关闭日期选择器。

library('shiny')

shinyApp(
  ui = fluidPage(
    includeScript("code.js"),
    fluidRow(
      column(4, 
             dateRangeInput("dates", label = h3("Date range")),
             verbatimTextOutput("datesOut")
      )
    )
  ), 
  server = function(input, output) {
    output$datesOut <- renderPrint({ input$dates })
  }
)

和code.js.

$(document).ready(function(){

  $('#dates input').bsDatepicker({
    autoclose: true
  });
  $("#dates").attr('onkeydown', 'return false');
});