获取选定行的单元格值
Posted
技术标签:
【中文标题】获取选定行的单元格值【英文标题】：Getting the cell values for a selected row 【发布时间】：2018-03-10 14:13:27 【问题描述】：我正在尝试研究如何从一行中选择数据（单元格值）。文档似乎不是那么清楚，添加钩子的示例似乎有些压倒性。
https://docs.handsontable.com/0.34.4/Hooks.html
这是我尝试过的。
var data = [
["", "Ford", "Volvo", "Toyota", "Honda"],
["2014", 10, 11, 12, 13],
["2015", 20, 11, 14, 13],
["2016", 30, 15, 12, 13]
];
var container = document.getElementById('example');
var hot = new Handsontable(container,
data: data,
minSpareRows: 1,
rowHeaders: true,
colHeaders: true,
contextMenu: true
);
//This is where I think I should add something like this but this is where I'm lost.
hot.addHook('getCell');<link href="https://docs.handsontable.com/0.34.4/bower_components/handsontable/dist/handsontable.full.css" rel="stylesheet"/>
<script src="https://docs.handsontable.com/0.34.4/bower_components/handsontable/dist/handsontable.full.js"></script>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="./node_modules/handsontable/dist/handsontable.full.js"></script>
<script src="bundle.js"></script>
<link rel="stylesheet" media="screen" href="./node_modules/handsontable/dist/handsontable.full.css">
</head>
<body>
<div id="example"></div>
</body>
</html>【问题讨论】：
【参考方案1】：我认为这就是您要寻找的。从阅读文档看起来你需要给钩子一个回调。由于您想在单击单元格时获取该行，因此您要注册的事件是afterSelection。
选择一个或多个单元格后（例如，在鼠标移动期间）触发此回调，当发生这种情况时，您可以访问回调的参数。然后你就可以使用 Handsontable 核心 api 来拉取cell/row/col/etc 数据
var data = [
["", "Ford", "Volvo", "Toyota", "Honda"],
["2014", 10, 11, 12, 13],
["2015", 20, 11, 14, 13],
["2016", 30, 15, 12, 13]
];
var container = document.getElementById('example');
var hot = new Handsontable(container,
data: data,
minSpareRows: 1,
rowHeaders: true,
colHeaders: true,
contextMenu: true
);
// create a hook with an event from Handstable core events
hot.addHook('afterSelection', function(row,column)
const selectedCell = hot.getDataAtCell(row,column);
const selectedCol = hot.getDataAtCol(column);
const selectedRow = hot.getDataAtRow(row);
console.log(`selected cell [$row][$column] with value [$selectedCell]`)
console.log(`column values: $JSON.stringify(selectedCol)`);
console.log(`row values: $JSON.stringify(selectedRow)`)
);<link href="https://docs.handsontable.com/0.34.4/bower_components/handsontable/dist/handsontable.full.css" rel="stylesheet" />
<script src="https://docs.handsontable.com/0.34.4/bower_components/handsontable/dist/handsontable.full.js"></script>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="./node_modules/handsontable/dist/handsontable.full.js"></script>
<script src="bundle.js"></script>
<link rel="stylesheet" media="screen" href="./node_modules/handsontable/dist/handsontable.full.css">
</head>
<body>
<div id="example"></div>
</body>
</html>【讨论】：
啊，谢谢！getCell 是否应该在每次选择一行时触发？
@user1513388 不，这不是一个事件挂钩，文档中实际上有很多它们，您将以相同的方式使用它们。我在示例中写的那个是当你调用getCell 时任意调用来获取一行；我想这就是你要找的东西。
几乎是我需要的。本质上，我尝试在选择行时抓取行数据，以便将其传递给 HighCharts 图表。
@user1513388 我刚刚用事件而不是自定义挂钩更新了示例。这应该是您正在寻找的内容，您可以将其用于所有其他事件。
几乎完全符合我的需要。如何获取行中的所有单元格而不仅仅是行中的第一个单元格？以上是关于获取选定行的单元格值的主要内容，如果未能解决你的问题，请参考以下文章
C# Winforms DataGridView 选定单元格正在清除单元格值
Qt C++ 从 QTableView 中获取选定行的每个单元格的数据