javascript – dateInput在闪亮的DT上不起作用

我正在尝试用Shiny创建一个带有几个输入的DT. selectInput和numericInput的列工作正常,但是dateInputs的列没有.这就像输入$date_n根本不存在.

我对JS几乎一无所知,我认为问题在于drawCallback.我刚从这里的另一个问题中复制了这段代码,并且在我尝试使用dateInput之前它工作正常.

下面是一个重现问题的小代码.前两个输出都没问题,但第三个输出正好显示出来.

library(shiny)
library(DT)

ui = fluidPage(title = 'Test',
               DTOutput('table'),
               verbatimTextOutput('chosen_letter'),
               verbatimTextOutput('chosen_value'),
               verbatimTextOutput('chosen_date'))

server <- shinyServer(function(input, output, session) {
output$table = renderDT({

sel_letter = paste0("<select id='letter_", 1:3, "'>
                    <option value='a' selected='selected'>A</option>
                    <option value='b'>B</option>
                    <option value='c'>C</option>
                    </select>")

sel_value = paste0("<input id='value_", 1:3, "' class='shiny-bound-input' 
                    value = '", 1:3, "' type='number' step = '1'>")

sel_date = paste0("<input id='date_", 1:3, "' type='date' value='2018-07-31'
                   class='shiny-bound-input' min='2018-07-31' max='2018-12-31'>")

datatable(data.frame(Letter = sel_letter, Value = sel_value, Date = sel_date), 
          rownames = F, selection = 'none', escape = F,
          options = list(drawCallback = JS('function(settings) {
                                           Shiny.bindAll(this.api().table().node());}'),
                         dom = 't', ordering = F, pageLength = 15))
})

output$chosen_letter = renderText({c(input$letter_1, input$letter_2, input$letter_3)})

output$chosen_value = renderText({sum(input$value_1, input$value_2, input$value_3)})

output$chosen_date = renderText({input$date_1})

})

shinyApp(ui, server)

解决方法:

dateInput

library(shiny)
library(DT)

ui <- fluidPage(

  # define a hidden dateInput in order that Shiny loads the dependencies
  div(style = "display: none;",
    dateInput("x", label = NULL)
  ),

  DTOutput("table")
)


js <- c(
  "function(settings){",
  "  $('#calendar').bsDatepicker({",
  "    format: 'yyyy-mm-dd',",
  "    todayHighlight: true",
  "  });",
  "}"
) # available options: https://bootstrap-datepicker.readthedocs.io/en/latest/


server <- function(input, output, session){

  output[["table"]] <- renderDT({
    dat <- data.frame(
      V1 = "A",
      V2 = 99, 
      V3 = '<input id="calendar" type="text" class="form-control" value = "2019-03-08"/>',
      stringsAsFactors = FALSE
    )
    datatable(dat, escape = FALSE,
              options = 
                list(
                  initComplete = JS(js),
                  preDrawCallback = JS('function() { Shiny.unbindAll(this.api().table().node()); }'),
                  drawCallback = JS('function() { Shiny.bindAll(this.api().table().node()); } ')
                )
    )
  })

}


shinyApp(ui, server)

dateRangeInput

html <- '
<div class="input-daterange input-group" id="calendar">
    <input type="text" class="input-sm form-control" name="start" value = "2019-03-08" />
    <span class="input-group-addon">to</span>
    <input type="text" class="input-sm form-control" name="end" value = "2019-03-12" />
</div>'

  output[["table"]] <- renderDT({
    dat <- data.frame(
      V1 = "A",
      V2 = 99, 
      V3 = html,
      stringsAsFactors = FALSE
    )
    datatable(dat, escape = FALSE,
              options = 
                list(
                  initComplete = JS(js),
                  preDrawCallback = JS('function() { Shiny.unbindAll(this.api().table().node()); }'),
                  drawCallback = JS('function() { Shiny.bindAll(this.api().table().node()); } ')
                )
    )
  })

标签：dt,javascript,r,shiny
来源： https://codeday.me/bug/20191007/1863746.html