在Shiny DataTables中具有计算的可编辑列

如何解决在Shiny DataTables中具有计算的可编辑列

我有一个可编辑的数据表。这里的目标是让用户根据需要编辑GRPs/TRPs。编辑该列后，Costs($)列将相应更新。在这里，我尝试编写一些JS代码并将其合并到datatable回调参数中。 JS代码有些不正确，我无法弄清楚它是什么。我对JS非常陌生。

# the math behind it
cost = OVERRIDE_CPP * GRPs/TRPs

df <- data.frame (Market  = c("ALBANY-SCHENECTADY-TROY,NY","ALBUQUERQUE-SANTA FE"),Weeks = c(1,1),OVERRIDE_CPP = c(141.7,188),GRPs_TRPs = c(100L,100L),Cost = c(14170,18800),Impressions = c(2053.993,2053.993)
)

# Coster DataTable JS function
CosterTableJS <- function() {
  return( 
    JS(
        "var ok = true;","function onUpdate(updatedCell,updatedRow,oldValue) {","  var column = updatedCell.index().column;","  if(column === 4){","    ok = false;","  }else if(column === 3){","    ok = true;","  }","}","","// make the datatable","var format_datatable = function(d,rowIdx){","  // footer callback to display the totals","  var footerCallback = function(tfoot,data,start,end,display){","    var api = this.api();","// update the Cost when the GRP/TRP's are changed","    var col_trp_grp = api.column(3).data();","    var col_override_cpp = api.column(2).data();","    if(ok){","      for(var i = 0; i < col_trp_grp.length; i++){","        api.cell(i,4).data(parseFloat(col_trp_grp[i]) * parseFloat(col_override_cpp[i]));","      }","    }","    Shiny.setInputValue('weeklyData:weeklyData',table.data().toArray());","  var n = d.length - 1;","  var id = 'table#';","  var columns = Object.keys(d[n][0]).map(function(x){","    return {data: x,title: x};","  });","  if (Object.keys(d[n][0]).indexOf('_details') === -1) {","    var subtable = $(id).DataTable({","                 'data': d[n],","                 'columns': columns,"                 'autoWidth': true,"                 'deferRender': true,"                 'info': false,"                 'lengthChange': false,"                 'ordering': d[n].length > 1,"                 'order': [],"                 'paging': true,"                 'scrollX': false,"                 'scrollY': false,"                 'searching': false,"                 'sortClasses': false,"                 'pageLength': 50,"                 'footerCallback': footerCallback,"                 'columnDefs': [","                  {targets: [0,1,2,3,4,5]},"                  {targets: '_all',className: 'dt-center'}","                 ]","               });","  } else {","            'data': d[n],"            'columns': columns,"            'autoWidth': true,"            'deferRender': true,"            'info': false,"            'lengthChange': false,"            'ordering': d[n].length > 1,"            'order': [],"            'paging': true,"            'scrollX': false,"            'scrollY': false,"            'searching': false,"            'sortClasses': false,"            'pageLength': 50,"            'footerCallback': footerCallback,"            'columnDefs': [","              {targets: -1,visible: false},"              {targets: 0,orderable: false,className: 'details-control'},"              {targets: '_all',"             ]","          }).column(0).nodes().to$().css({cursor: 'pointer'});","};"
    )
  )
}

 coster_callback_js <- CosterTableJS()
 rowNames <- FALSE

# Table
datatable(
  df,callback = coster_callback_js,rownames = rowNames,style = "bootstrap4",extensions = 'Buttons',options = list(
    dom = "Bt",columnDefs = list(
      list(width = '300px',targets = 0)
    ),lengthMenu = list(c(-1,10,20),c("All",20))
  )
)