在R Shiny的數據表中添加工具提示

Question

我正在嘗試使用JS腳本attr函數添加工具提示，有些原因是編寫的腳本無法達到預期的效果（為數據表的第一列添加工具提示）。由於我是新的JS腳本，因此無法調試錯誤，誰能建議我為什么下面的代碼沒有給我正確的結果。 這是一段代碼：

library(shiny)
library(DT)

shinyApp(
ui = fluidPage(

DT::dataTableOutput("table2")

),
server = function(input, output) {

output$table2<-DT::renderDataTable({
  responseDataFilter2_home<-iris[,c(4,3,1)]
  displayableData<-as.data.frame(responseDataFilter2_home, stringAsFactors = FALSe, row.names = NULL)
},server = TRUE, selection = 'single',callback = JS("table.on('dblclick.dt', 'td', function(nRow, aData){
                                                         var row=table.cell(this).index().row;
                                                        var full_text = aData[1] + ','+ aData[2]
                                                        $('td:eq(1)', nRow).attr('title', full_text);
                                                         Shiny.onInputChange('rows_home',[row, Math.random()]);});
                                                         table.on('click.dt', 'td', function(nRow, aData) {
                                                         var k=table.cell(this).index().row;
                                                        var full_text = aData[1] + ','+ aData[2]
                                                        $('td:eq(1)', nRow).attr('title', full_text);
                                                         if(table.rows('.selected').indexes().toArray()!= '' && table.rows('.selected').indexes().toArray() ==k){
                                                         k=-1;}
                                                         Shiny.onInputChange('rows_up_home',[k, Math.random()]);
                                                         });"),
escape=FALSE,options=list(paging=FALSE,searching = FALSE,ordering=FALSE,scrollY = 400,scrollCollapse=TRUE,
                          columnDefs = list(list(width = '800%', targets = c(1)))),rownames=FALSE,colnames="Name")

}
)

Answer 1

我已使用在此鏈接中給出的答案修改了您的代碼，以便獲得工具提示，而不會影響JS代碼的其他部分：

library(shiny)
library(DT)

shinyApp(
  ui = fluidPage(

    DT::dataTableOutput("table2")

  ),
  server = function(input, output) {

    output$table2<-DT::renderDataTable({
      responseDataFilter2_home<-iris[,c(4,3,1)]
      displayableData<-DT::datatable(data = as.data.frame(responseDataFilter2_home, stringAsFactors = FALSE, row.names = NULL),rownames = FALSE,
                                     escape = FALSE, selection = 'single', callback =  JS("table.on('dblclick.dt', 'td', function(nRow, aData){
                                                         var row=table.cell(this).index().row;
                                                        var full_text = aData[1] + ','+ aData[2]
                                                        $('td:eq(1)', nRow).attr('title', full_text);
                                                        Shiny.onInputChange('rows_home',[row, Math.random()]);});
                                                        table.on('click.dt', 'td', function(nRow, aData) {
                                                        var k=table.cell(this).index().row;
                                                        var full_text = aData[1] + ','+ aData[2]
                                                        $('td:eq(1)', nRow).attr('title', full_text);
                                                        if(table.rows('.selected').indexes().toArray()!= '' && table.rows('.selected').indexes().toArray() ==k){
                                                        k=-1;}
                                                        Shiny.onInputChange('rows_up_home',[k, Math.random()]);
                                                        });"),

                                     options = list(rowCallback = JS(
                                       "function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {",
                                       "var full_text = aData[0] + ','+ aData[1];",
                                       "$('td:eq(0)', nRow).attr('title', full_text);",
                                       "}"),paging=FALSE,searching = FALSE,ordering=FALSE,scrollY = 400,scrollCollapse=TRUE,
                                       columnDefs = list(list(width = '800%', targets = c(1))),colnames="Name") )


    })

    })

希望能幫助到你！

Answer 2

您可以從以下最小的工作示例開始：

library(shiny)
library(DT)

shinyApp(
  ui = fluidPage(

    DT::dataTableOutput("table2")

  ),
  server = function(input, output) {

    output$table2<-DT::renderDataTable({
      responseDataFilter2_home<-iris[,c(4,3,1)]
      displayableData<-DT::datatable(responseDataFilter2_home,options = list(rowCallback = JS(
        "function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {",
        "var full_text = aData[1] + ','+ aData[2]",
        "$('td:eq(1)', nRow).attr('title', full_text);",
        "}")
      ))#, stringAsFactors = FALSe, row.names = NULL)
    },server = TRUE, selection = 'single', escape=FALSE,options=list(paging=FALSE,searching = FALSE,ordering=FALSE,scrollY = 400,scrollCollapse=TRUE,
                          columnDefs = list(list(width = '800%', targets = c(1)))),rownames=FALSE,colnames="Name")

    }
 )