如何在 rhandsontable 中将逻辑值显示为 UI 上的复选框

Posted 2023-03-22

【中文标题】如何在 rhandsontable 中将逻辑值显示为 UI 上的复选框

【英文标题】：How to show logical values in rhandsontable as the check boxes on UI

【发布时间】：2021-12-11 10:26:04

【问题描述】：

我有一个关于如何将 rhandsontable 中的逻辑值显示为 UI 上的复选框的问题。这是来自 (https://cran.r-project.org/web/packages/rhandsontable/vignettes/intro_rhandsontable.html) 的代码。

library(rhandsontable)

DF = data.frame(val = 1:10, bool = TRUE, big = LETTERS[1:10],
                small = letters[1:10],
                dt = seq(from = Sys.Date(), by = "days", length.out = 10),
                stringsAsFactors = FALSE)

col_highlight = 2
row_highlight = c(5, 7)

rhandsontable(DF, col_highlight = col_highlight, 
              row_highlight = row_highlight,
              width = 550, height = 300) %>%
  hot_cols(renderer = "
    function(instance, td, row, col, prop, value, cellProperties) 
      Handsontable.renderers.TextRenderer.apply(this, arguments);
      
      tbl = this.HTMLWidgets.widgets[0]

      hcols = tbl.params.col_highlight
      hcols = hcols instanceof Array ? hcols : [hcols] 
      hrows = tbl.params.row_highlight
      hrows = hrows instanceof Array ? hrows : [hrows] 

      if (hcols.includes(col) && hrows.includes(row)) 
        td.style.background = 'red';
      
      else if (hcols.includes(col)) 
        td.style.background = 'lightgreen';
      
      else if (hrows.includes(row)) 
        td.style.background = 'pink';
      
      
      return td;
  ")

如您所见，bool 列未显示为复选框，它们也不可编辑。有谁知道如何（1）将逻辑列显示为 UI 上的复选框，以及（2）如何使该列可编辑？您的任何意见将不胜感激。

【参考方案1】：

这是因为您不能使用文本渲染器来渲染布尔值。您需要改用CheckboxRenderer。以下是修复方法：

library(rhandsontable)

DF = data.frame(val = 1:10, bool = TRUE, big = LETTERS[1:10],
                small = letters[1:10],
                dt = seq(from = Sys.Date(), by = "days", length.out = 10),
                stringsAsFactors = FALSE)

col_highlight = 2
row_highlight = c(5, 7)

rhandsontable(DF, col_highlight = col_highlight, 
              row_highlight = row_highlight,
              width = 550, height = 300) %>%
    hot_cols(renderer = "
    function(instance, td, row, col, prop, value, cellProperties) 
    console.log(typeof value)
      if(typeof value === 'boolean') 
         Handsontable.renderers.CheckboxRenderer.apply(this, arguments);
       else 
        Handsontable.renderers.TextRenderer.apply(this, arguments);
      
     
      
      tbl = this.HTMLWidgets.widgets[0]
      console.log(value)
      hcols = tbl.params.col_highlight
      hcols = hcols instanceof Array ? hcols : [hcols] 
      hrows = tbl.params.row_highlight
      hrows = hrows instanceof Array ? hrows : [hrows] 

      if (hcols.includes(col) && hrows.includes(row)) 
        td.style.background = 'red';
      
      else if (hcols.includes(col)) 
        td.style.background = 'lightgreen';
      
      else if (hrows.includes(row)) 
        td.style.background = 'pink';
      
      
      return td;
  ")

【讨论】：

您好 lz100，非常感谢您的帮助。是的，这正是我正在寻找的。我非常感谢您的解决方案。

@BoYu，太好了。那么请您接受它作为最佳答案吗？

您好 lz100，我很想这样做，但我对系统不熟悉。您能否告诉我在哪里以及如何接受作为最佳答案？再次感谢您的帮助。

@BoYu, this page 应该会有所帮助

您好 lz100，感谢您与我分享评级链接。我做到了。再次非常感谢您的帮助。