Ag-grid 未将行焦点保持在 table 刷新
Ag-grid not keeping row focus on table refresh
我有一个 ag-grid table 每隔几秒刷新一次数据。每当它这样做时,选定的 table 行就会失去焦点,我正试图找出一种方法来强制返回焦点。我认为这就像跟踪所选节点一样简单,然后在刷新发生时设置值但它似乎不起作用。基本上,每当用户在 table 中进行选择时,我都会跟踪节点和聚焦的单元格:
function onSelectionChanged() {
var selectedRowNode = $scope.ResourceCheckoutTableGrid.api.getSelectedNodes()[0];
$scope.focusedCell = $scope.ResourceCheckoutTableGrid.api.getFocusedCell();
$scope.selectedRowNode = selectedRowNode;
}
然后,我每三秒加载一次 table 数据:
$scope.startRefresh = function() {
setInterval(function() {
$scope.loadTableData();
},3000)
}
重新加载 table 数据时,它失去了焦点,但我尝试使用保存的值将其恢复:
$scope.loadTableData = function() {
$http.get('RobotDataInterface/Resource/getAllCheckedOutResources').success(
function(data) {
$scope.rowCount = data.length;
if ($scope.ResourceCheckoutTableGrid.api != undefined) {
$scope.ResourceCheckoutTableGrid.api.setRowData(data);
$scope.ResourceCheckoutTableGrid.api.sizeColumnsToFit();
var node = $scope.selectedRowNode;
var cell = $scope.focusedCell;
if (node != "" && cell != "") {
node.setSelected(true);
$scope.ResourceCheckoutTableGrid.api.setFocusedCell(cell.rowIndex, cell.column);
}
}
});
};
如果我设置断点,我可以看到它在进行这些调用时:
node.setSelected(true);
$scope.ResourceCheckoutTableGrid.api.setFocusedCell(cell.rowIndex, cell.column);
我可以看到这些值是我所期望的;节点和焦点单元格、rowIndex 等是我所期望的,但所选行仍然失去焦点(即使它实际上确实设置为 'selected = true'。有人知道我做错了什么吗?
为了达到预期效果,将setFocusedCell方法中的cell.column改为cell.column.colId
好的,看起来这对我想做的事情有效;而不是我需要将节点本身设置为 selected = true 的单元格焦点......我可以发誓我早些时候做了这个,甚至验证它正在将 selected 设置为 true,但是无论哪种方式,这段代码都实现了预期的结果:
$scope.ResourceCheckoutTableGrid.api.forEachNode((node) => {
if (node.childIndex === ($scope.selectedRowNode.childIndex)) {
node.setSelected(true);
return;
}
});
我有一个 ag-grid table 每隔几秒刷新一次数据。每当它这样做时,选定的 table 行就会失去焦点,我正试图找出一种方法来强制返回焦点。我认为这就像跟踪所选节点一样简单,然后在刷新发生时设置值但它似乎不起作用。基本上,每当用户在 table 中进行选择时,我都会跟踪节点和聚焦的单元格:
function onSelectionChanged() {
var selectedRowNode = $scope.ResourceCheckoutTableGrid.api.getSelectedNodes()[0];
$scope.focusedCell = $scope.ResourceCheckoutTableGrid.api.getFocusedCell();
$scope.selectedRowNode = selectedRowNode;
}
然后,我每三秒加载一次 table 数据:
$scope.startRefresh = function() {
setInterval(function() {
$scope.loadTableData();
},3000)
}
重新加载 table 数据时,它失去了焦点,但我尝试使用保存的值将其恢复:
$scope.loadTableData = function() {
$http.get('RobotDataInterface/Resource/getAllCheckedOutResources').success(
function(data) {
$scope.rowCount = data.length;
if ($scope.ResourceCheckoutTableGrid.api != undefined) {
$scope.ResourceCheckoutTableGrid.api.setRowData(data);
$scope.ResourceCheckoutTableGrid.api.sizeColumnsToFit();
var node = $scope.selectedRowNode;
var cell = $scope.focusedCell;
if (node != "" && cell != "") {
node.setSelected(true);
$scope.ResourceCheckoutTableGrid.api.setFocusedCell(cell.rowIndex, cell.column);
}
}
});
};
如果我设置断点,我可以看到它在进行这些调用时:
node.setSelected(true);
$scope.ResourceCheckoutTableGrid.api.setFocusedCell(cell.rowIndex, cell.column);
我可以看到这些值是我所期望的;节点和焦点单元格、rowIndex 等是我所期望的,但所选行仍然失去焦点(即使它实际上确实设置为 'selected = true'。有人知道我做错了什么吗?
为了达到预期效果,将setFocusedCell方法中的cell.column改为cell.column.colId
好的,看起来这对我想做的事情有效;而不是我需要将节点本身设置为 selected = true 的单元格焦点......我可以发誓我早些时候做了这个,甚至验证它正在将 selected 设置为 true,但是无论哪种方式,这段代码都实现了预期的结果:
$scope.ResourceCheckoutTableGrid.api.forEachNode((node) => {
if (node.childIndex === ($scope.selectedRowNode.childIndex)) {
node.setSelected(true);
return;
}
});