我们可以使用 JavaScript 库 CellEdit 做到这一点。下载文件dataTables.cellEdit.js。
默认情况下,界面不是很时尚。要设置样式,请复制下面的 CSS 代码并将其放入 dataTables.cellEdit.css 文件中,该文件与 dataTables.cellEdit.js 位于同一文件夹中。
.my-input-class {
padding: 3px 6px;
border: 1px solid #ccc;
border-radius: 4px;
}
.my-confirm-class {
padding: 3px 6px;
font-size: 12px;
color: white;
text-align: center;
vertical-align: middle;
border-radius: 4px;
background-color: #337ab7;
text-decoration: none;
}
.my-cancel-class {
padding: 3px 6px;
font-size: 12px;
color: white;
text-align: center;
vertical-align: middle;
border-radius: 4px;
background-color: #a94442;
text-decoration: none;
}
现在,这里是 R 代码。不要忘记更改path 变量。
library(DT)
dat <- data.frame(
Action = c("Keep data", "Keep data", "Keep data"),
X = c(1, 2, 3),
Y = c("a", "b", "c")
)
callback = JS(
"function onUpdate(updatedCell, updatedRow, oldValue){}",
"table.MakeCellsEditable({",
" onUpdate: onUpdate,",
" inputCss: 'my-input-class',",
" confirmationButton: {",
" confirmCss: 'my-confirm-class',",
" cancelCss: 'my-cancel-class'",
" },",
" inputTypes: [",
" {",
" column: 0,",
" type: 'list',",
" options: [",
" {value: 'Keep data', display: 'Keep data'},",
" {value: 'Pass', display: 'Pass'},",
" {value: 'Delete', display: 'Delete'}",
" ]",
" }",
" ]",
"});")
## the datatable
dtable <- datatable(
dat, callback = callback, rownames = FALSE,
options = list(
columnDefs = list(
list(targets = "_all", className = "dt-center")
)
)
)
path <- "~/Work/R/DT" # folder containing the files dataTables.cellEdit.js
# and dataTables.cellEdit.css
dep <- htmltools::htmlDependency(
"CellEdit", "1.0.19", path,
script = "dataTables.cellEdit.js", stylesheet = "dataTables.cellEdit.css")
dtable$dependencies <- c(dtable$dependencies, list(dep))
dtable
查看实际操作:
查看CellEdit repo 上的可能选项。特别是,您可以禁用某些列的编辑,并且您可以根据需要摆脱“确认/取消”按钮。