Question

我正在尝试将复选框设置到DT表中并收集有关已检查行的信息我的代码在下面

shinyApp(
  ui = fluidPage(
    fluidRow(
      verbatimTextOutput("value1"),
      column(12,
             DT::dataTableOutput('table'),  tags$script(HTML('$(document).on("click", "input", function () {
                       var checkboxes = document.getElementsByName("selected");
                       var checkboxesChecked = [];
                       for (var i=0; i<checkboxes.length; i++) {
                       if (checkboxes[i].checked) {
                       checkboxesChecked.push(checkboxes[i].value);
                      }
                      }
                     Shiny.onInputChange("checked_rows",checkboxesChecked);  })'))
      ))),
  server = function(input, output) {
    library(DT)
    library(glue)
    output$value1 <- renderPrint({ input$checked_rows }) 

    output$table <- DT::renderDataTable({
      iris$checked<-''
      iris$checked[2:5]<-'checked=\"checked\"'
      iris[["Select"]]<-glue::glue('<input type="checkbox" name="selected" {iris$checked} value="{1:nrow(iris)}"><br>')
      datatable(iris,escape=F,rownames=F,  class = 'cell-border compact', 
                options=list(ordering=T,autowidth=F,scrollX = TRUE,
                columnDefs = list(list(className = 'dt-center', targets = "_all"))
                ),
                selection="none"
      ) })})

一切看起来不错，但是：
1.当我在复选框中进行选择并更改页面时，上一页中的所有数据都会消失 2.另外，正如您在verbatimTextOutput（“value1”）上看到的那样，仅从当前页面中选择复选框是值得的。如何轮询整个表格，而不仅仅是我看到的页面？

谢谢！

Answer 1

从下图中可以看出，datatables库（DT包用来显示漂亮表格的javascript库）只渲染当前页面显示的表格的部分（＆＃39;只有10 <tr>个标签，但该表包含150行）。

您的脚本无法正确计算的原因，因为这只是DOM中表格的一部分。

此外，DT软件包默认启用服务器端进程模式（通过在R或datatables.net/manual/server-side中调用?DT::renderDT来查看帮助），这意味着浏览器不仅会以正在显示的数据。 换句话说，如果启用了服务器端处理模式，则无法在浏览器中正确计算。

然而，存在另外的替代方式：

使用参数selection = "multiple"：虽然它没有给你一个复选框，但它基本上是你需要的;
如果您确实需要一个复选框，可能会发现rstudio/DT#93comment或shinyapps/DT-radio有帮助;
或者您可以禁用服务器处理模式并编写一个侦听器，以便在单击复选框时更改表数据。并计算如下。

码

$(document).on("click", "input", function () {
      var data = table.data();
      var res = [];
      var elem;
      for (var i=0; i < data.length; i++) {
        elem = $.parseHTML(data[i][6])[0];
        if (elem.checked) {
          res.push(elem.value);
        }
      }
      Shiny.onInputChange("checked_rows", res);  }
  )

DT闪亮的复选框

1 个答案:

码