【问题标题】：R Shiny Datatable: prevent deselection of an already selected row when you click on it againR Shiny Datatable：防止再次单击已选择的行时取消选择它
【发布时间】：2019-02-04 18:04:17
【问题描述】：

R（版本 3.4.1）我正在使用闪亮的（版本 1.0.5）中的 DT（版本 0.4）包，并且需要在用户再次单击它时防止取消选择已选择的行。例如，在下图中，如果用户再次单击第 3 行，则不应取消选择。但是，如果用户选择一个新行，则该新行将被选中，而先前的行将被取消选择。

我想我需要的是让数据表完全忽略已选择行上的点击事件。

我尝试使用shinyjs::onclick，如下所示，但并不理想，因为它似乎“取消选择并重新选择”选定的行（蓝色突出显示消失并在再次单击时重新出现) 而不是防止取消选择。

library(shiny)
library(DT)
library(shinyjs)

shinyApp(
  ui <- shinyUI(
    fluidPage(
      shinyjs::useShinyjs(),
      DTOutput("test")
    )
  ),  
  server <- shinyServer(function(input, output, session) {

    output$test <- renderDT({
      datatable(head(iris), selection = 'single')
    })    
    shinyjs::onclick("test",
               selectRows(dataTableProxy("test"), selected = input$test_rows_selected)
             )    
  })
)

我想知道是否有一种简单的方法可以做到这一点。谢谢！

【问题讨论】：

Shree，我已经编辑了我的第一个答案以提供一个可行的解决方案。告诉我它是否适合你。

标签： javascript r datatables shiny dt

【解决方案1】：

这只是部分解决方案（请参阅下面的编辑了解完整的解决方案）。它仅在您单击该行两次时才有效。第三次单击时，该行被取消选择，我不知道为什么。也许datatables 的专家可以提供帮助。

library(shiny)
library(DT)

shinyApp(
  ui <- shinyUI(
    fluidPage(
      DTOutput("test")
    )
  ),  
  server <- shinyServer(function(input, output, session) {

    output$test <- renderDT({
      datatable(head(iris), selection = list(mode="single", target="row"), 
                extensions = c("Select"), options = list(select=TRUE),
                callback = JS("
table.on('user-select', 
function (e, dt, type, cell, originalEvent) {
  if ($(cell.node()).parent().hasClass('selected')) {
    e.preventDefault();
  }
});"))
    })    
  })
)

编辑

我找到了解决方案（我不完全理解）。

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

    output$test <- renderDT({
      datatable(head(iris), selection = list(mode="single", target="row", info=FALSE), 
                extensions = c("Select"), options = list(select=TRUE),
                callback = JS("
  table.on('user-select', 
    function (e, dt, type, cell, originalEvent) {
      if ($(cell.node()).parent().hasClass('selected') || e.result === undefined) {
        e.preventDefault();
        $(cell.node()).parent().addClass('selected')
        return false;
      }
    });")
      )
    })    
  })

【讨论】：

这个解决方案似乎和我的一样（使用shinjs::onclick()），即先取消选择然后重新选择点击的行。我错过了什么吗？我想我需要的是让数据表完全忽略已选择行上的点击事件。希望这是有道理的。谢谢！
@Shree 我不确定在第一次点击时该行是否被取消选择。但似乎这就是下一次点击时发生的事情。但我完全不确定。
@Shree 你对这种方式不满意吗？为什么？也许你应该明确你想做什么。

【解决方案2】：

尝试在 css 中使用pointer-events: none：

table.dataTable tbody tr.selected {
  pointer-events: none
}

唯一的限制是它会阻止当前选定行上的整个悬停/单击事件，因此您不能在具有可悬停/可单击 HTML 内容的列上使用它。

希望对你有帮助！

【讨论】：

这太棒了！谢谢！