Reputation: 47
I have one question on how to show the logical values in rhandsontable as check boxes on UI. Here is the code originally from (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;
}")
As you can see, the bool column was not shown as the check boxex and they are not editable too. Does anyone know how to (1) show the logic column as check boxes on UI, and (2) how to make that column as editable? Any your input will be greatly apprreciated.
Upvotes: 0
Views: 411
Reputation: 7360
This is because you can't use a text renderer to render boolean values. You need to use CheckboxRenderer
instead. Here is how to fix:
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;
}")
Upvotes: 1