如何根据列中的值在 DataTable 中预 select 行?
How do I pre-select rows in a DataTable based on the value in a column?
情况:
我有一个 pandas 数据帧,我通过 df.to_html() 将其转换为 html table。然后我将 DataTables class 添加到 table。此 DataTables-table 包含以下列:
编号 | × |是 | Val |...更多专栏...| Selection_Criteria |...更多专栏...
Selection_Criteria 中的值可以是 1 或 0。我知道:
$('#ProductList').DataTable( {
...
"fnInitComplete": function(oSettings, json) { $('#ProductList tbody tr:eq(0)').click(); }
});
(来源:http://code.datatables.net/forums/discussion/38171/automatic-select-of-the-first-row-on-reload)
..理论上可以 select 第一行。 (实际上,我无法模拟第一行的点击。)
但我的问题更倾向于:如何自动预先 select Selection_Criteria 中值为 1 的所有行?什么是最好的方法?这应该在 client/server 边完成吗?
在 pandas 中,术语 "select"(ing) 表示筛选掉未被 select 编辑的内容。我知道在网页的 table 中,selected 可能意味着突出显示以从其他页面中脱颖而出。有几种方法可以在服务器端执行此操作。您可以显示两个 table,一个对应 Selection_Criteria 的每个状态。这将使您免于首先尝试从 table 中提取 select 单独行的麻烦(这将通过 Javascript 而不是 Pandas 来完成)。虽然 pandas 能够将 class 添加到结果 html,但 class 应用于元素。
如果您正在使用 jquery,您将使用这些片段。因为你没有提供示例数据,所以我不能准确。
将下一行中的 x 替换为 Selection_Criteria=1 在 table
中的列数
$( "tr td:nth-child(x):contains('1')" ).addClass('selected');
后端有使用beautifulsoup 和css select 或lxml.etree 与xpath select 的解决方案。但是jquery将是这个问题最简洁的。
您可以通过在初始化 DataTable 时为 "rowCallback" 选项提供一个函数来实现。 https://datatables.net/reference/option/rowCallback
此外,通常最好使用 API 方法处理 select 行,而不是仅仅更改 class。我发现 DataTable + Select 库保留了 selected 行索引的内部集合(如果服务器端处理打开,则只是当前页面)而不是使用 class 来解析 selected 项目。
因此,虽然显示看起来正确,但如果您只是更改 class,如果您稍后依赖任何 API 方法来获取 selected 项目,将会成为问题。此外,仅更改行上的 class 不会触发 table 上的任何 "select" 事件,因此您也不能依赖这些事件。
@Aliester。谢谢指点!
这帮助我找到了我自己问题的解决方案。我做了什么:
1.) 在 table 加载时确定我想要 select 的行索引。
2.) 将索引传递给js。
3.) 遍历索引并对每个索引条目应用以下命令:
table.row(':eq('+hit_index_row+')').select();
所以我使用 API 到 select 每一行。这对我有用,希望对其他人也有帮助。可能有点hacky,欢迎更优雅的建议!
情况:
我有一个 pandas 数据帧,我通过 df.to_html() 将其转换为 html table。然后我将 DataTables class 添加到 table。此 DataTables-table 包含以下列:
编号 | × |是 | Val |...更多专栏...| Selection_Criteria |...更多专栏...
Selection_Criteria 中的值可以是 1 或 0。我知道:
$('#ProductList').DataTable( {
...
"fnInitComplete": function(oSettings, json) { $('#ProductList tbody tr:eq(0)').click(); }
});
(来源:http://code.datatables.net/forums/discussion/38171/automatic-select-of-the-first-row-on-reload)
..理论上可以 select 第一行。 (实际上,我无法模拟第一行的点击。)
但我的问题更倾向于:如何自动预先 select Selection_Criteria 中值为 1 的所有行?什么是最好的方法?这应该在 client/server 边完成吗?
在 pandas 中,术语 "select"(ing) 表示筛选掉未被 select 编辑的内容。我知道在网页的 table 中,selected 可能意味着突出显示以从其他页面中脱颖而出。有几种方法可以在服务器端执行此操作。您可以显示两个 table,一个对应 Selection_Criteria 的每个状态。这将使您免于首先尝试从 table 中提取 select 单独行的麻烦(这将通过 Javascript 而不是 Pandas 来完成)。虽然 pandas 能够将 class 添加到结果 html,但 class 应用于元素。
如果您正在使用 jquery,您将使用这些片段。因为你没有提供示例数据,所以我不能准确。
将下一行中的 x 替换为 Selection_Criteria=1 在 table
中的列数$( "tr td:nth-child(x):contains('1')" ).addClass('selected');
后端有使用beautifulsoup 和css select 或lxml.etree 与xpath select 的解决方案。但是jquery将是这个问题最简洁的。
您可以通过在初始化 DataTable 时为 "rowCallback" 选项提供一个函数来实现。 https://datatables.net/reference/option/rowCallback
此外,通常最好使用 API 方法处理 select 行,而不是仅仅更改 class。我发现 DataTable + Select 库保留了 selected 行索引的内部集合(如果服务器端处理打开,则只是当前页面)而不是使用 class 来解析 selected 项目。
因此,虽然显示看起来正确,但如果您只是更改 class,如果您稍后依赖任何 API 方法来获取 selected 项目,将会成为问题。此外,仅更改行上的 class 不会触发 table 上的任何 "select" 事件,因此您也不能依赖这些事件。
@Aliester。谢谢指点!
这帮助我找到了我自己问题的解决方案。我做了什么: 1.) 在 table 加载时确定我想要 select 的行索引。 2.) 将索引传递给js。 3.) 遍历索引并对每个索引条目应用以下命令:
table.row(':eq('+hit_index_row+')').select();
所以我使用 API 到 select 每一行。这对我有用,希望对其他人也有帮助。可能有点hacky,欢迎更优雅的建议!