python - 如何启用对 Dash DataTable 上特定行的编辑

我想在破折号数据表的特定行上启用修改,到目前为止我们可以按列启用编辑,但我不想在整个列上启用编辑,我只想在特定行上启用它. 我可以使用 style_data_conditional 突出显示该行:

style_data_conditional = [
                {
                    "if": {"column_id": x, "row_index": 2},
                    "backgroundColor": 'red',
                    "cursor": "pointer",
                }
                for x in df.columns[2:]
            ]

但我想让这一行也可以编辑。

最佳答案

一种方法是使用 css 使整个 DataTable 可编辑,并使特定行不可编辑。

import dash
import dash_table
import pandas as pd

df = pd.read_csv("https://raw.githubusercontent.com/plotly/datasets/master/solar.csv")

app = dash.Dash(__name__)

app.layout = dash_table.DataTable(
    id="table",
    columns=[{"name": i, "id": i} for i in df.columns],
    data=df.to_dict("records"),
    editable=True,
)


if __name__ == "__main__":
    app.run_server(debug=True)

DataTable 不可编辑时,td 包含一个包含单元格文本的 div。可编辑时,带有单元格文本的 div 的不透明度设置为 0,并添加带有单元格值的输入。

我们可以添加一些 css 来删除此输入,并将具有单元格值的 div 的 opacity 设置为 1 for td 元素,其中 data-dash-row 属性不等于某个行号:

td:not([data-dash-row="2"]) div.input-cell-value-shadow {
  opacity: 1 !important
}

td:not([data-dash-row="2"]) input {
  display: none;
}

所以上面的样式使得只有 DataTable 的第三行是可编辑的。

https://stackoverflow.com/questions/63576796/

相关文章:

javascript - 使用javascript强制刷新rss feed

java - 无法在数据库中使用 BCryptPassword 保存加密密码

node.js - 跟踪 Node.js 程序执行

ruby-on-rails - 在 Rails 中进行 View 更新的正确方法

python - Python中不同数据类型的大小

c++ - leveldb 是否每 4KB 或 2KB 数据 block 生成 Bloom Filt

python - Colab - python 代码中的 input() 框太长,所以我需要回滚才能

javascript - 在 quill-image-resize-vue 中对齐时出错

python-3.x - Python3 Beautifulsoup4 从多个容器兄弟中提取文本

python - 从数据框创建字典,其中多列的元组作为键,另一列作为值