时间戳

首页 > 解决方案 > 在 DT 中添加多个无线电组

javascript - 在 DT 中添加多个无线电组

问题描述

我一直想知道是否可以在闪亮的 DT 表中添加两个（或更多）单选组按钮。从这个页面来看，添加一个似乎很简单：https ://rstudio.github.io/DT/011-radio.html

尽管如此，我还是在为添加两个无线电组的可能性而苦苦挣扎。这是我的代码：

library(shiny)
ui <- bootstrapPage(DT::dataTableOutput("DT_table"))

server <- function(input, output) {

output$DT_table <- DT::renderDataTable({
m <- matrix(
  as.character(1:5), nrow = 12, ncol = 5, byrow = TRUE,
  dimnames = list(month.abb, LETTERS[1:5])
)

n <- matrix(
  as.character(1:5), nrow = 12, ncol = 5, byrow = TRUE,
  dimnames = list(month.abb, paste("P", LETTERS[1:5], sep = "_"))
)
for (i in seq_len(nrow(m))) {
  m[i, ] = sprintf(
    '<input type="radio" name="%s" value="%s"/>',
    month.abb[i], m[i, ]
  )
}

for (i in seq_len(nrow(n))) {
  n[i, ] = sprintf(
    '<input type="radio" name="%s" value="%s"/>',
    paste0("T2", month.abb[i]), n[i, ]
  )
}

dataset <- as.data.frame(cbind(m, n))
DT::datatable(dataset, selection = 'none', escape = FALSE, options = list(dom = 't', paging = FALSE, ordering = FALSE),
          callback = DT::JS("table.rows().every(function(i, tab, row) {
      var $this = $(this.node());
      $this.attr('id', this.data()[0]);
      $this.addClass('shiny-input-radiogroup');
    });
    Shiny.unbindAll(table.table().node());
    Shiny.bindAll(table.table().node());")
)}, server = FALSE)

observe({
  print(input$Jan)
  print(input$T2Jan)
})
}

shinyApp(ui = ui, server = server)

我清楚地看到问题来自我的回调参数，它将闪亮输入无线电组/ID 应用于整行而不是每行的每个无线电组。如您所见，我的 input$T2Jan 始终为 NULL。我对javascript真的很陌生，所以我不知道从哪里开始。

您认为通过一点 javascript 操作是可行的，还是在第一个数据表旁边创建另一个数据表更好？

标签： javascriptrshinydt

解决方案

你可以使用这个callback：

callback <- c(
  "  $('input[type=radio]').on('click', function(){",
  "    var name = $(this).attr('name');",
  "    var value = $('input[name=' + name + ']:checked').val();",
  "    Shiny.setInputValue(name, value);",
  "  });"
)

和：

DT::datatable(dataset, selection = 'none', escape = FALSE, 
              options = list(dom = 't', paging = FALSE, ordering = FALSE),
              callback = JS(callback) 
)

推荐阅读