【问题标题】:Select the next row in a ag-grid-table via button (also if the next row would be on the next page)?通过按钮选择 ag-grid-table 中的下一行(如果下一行在下一页上)?
【发布时间】:2020-11-29 18:48:48
【问题描述】:

我在 AngularJS 1.6 项目中使用 ag-grid。在这种特定情况下,我通过 ag-grid 有一个表,并通过单击选择单行(不可能进行多行选择)。我想用这个行数据(在这里无关紧要)做一些事情,我想通过按钮预选这一行之后的下一行。我是通过

组件:

// ag-grid event-hook
function onSelectionChanged() {
    ctrl.selectedItem = ctrl.gridOptions.api.getSelectedRows()[0];
    ctrl.selectedRowIndex = ctrl.gridOptions.api.getSelectedNodes()[0].rowIndex;
    $scope.$apply();

    doOtherStuff();
}

[...]

// function on button via ng-click
function selectNextItemInTable() {
    agGridService.selectGridRow(ctrl.gridOptions, ctrl.selectedRowIndex + 1);
}

[...]

agGridService:

function selectGridRow(gridOptions, index) {
    if(!gridOptions || !gridOptions.api) {
        return;
    }
    var rowNode = gridOptions.api.getDisplayedRowAtIndex(index);
    if(rowNode) {
        rowNode.setSelected(true);
    }
}

如果所选项目不是表格页面上的最后一个项目,它会起作用,但如果它是最后一个项目,不幸的是它不会预先选择下一页上的第一个项目,而是根本没有行。我该怎么做?

/Edit:我刚刚注意到它确实选择了列表中的下一行,它只是不改变页面!如果我手动更改它,我可以看到下一行被选中...所以我唯一需要的是检查是否必须通过 api 更改页面...

【问题讨论】:

  • 对于下一页,您需要使用 ...url?selection=121 ... 之类的查询传递选择数据,然后检查并选择
  • 这是一个 AngularJS SPA,所以这不正确......对不起。

标签: javascript angularjs ag-grid


【解决方案1】:

你可以使用gridOptions.api.getLastDisplayedRow()

这将为您提供当前页面上可见的最后一个 rowID。假设分页大小为 10 并且我们在第一页,那么此选项将返回 9(数组索引逻辑)。用你当前选择的行检查这个数字,如果这个数字等于你当前选择的行,那么你可以打电话给gridOptions.api.paginationGoToNextPage();

您可以使用以下条件来检查您是否在最后一页。

    gridOptions.api.paginationGetCurrentPage() < gridOptions.api.paginationGetTotalPages()

希望这会有所帮助,如果您需要更多帮助,请告诉我。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2019-07-26
    • 2017-03-03
    • 2017-09-25
    • 1970-01-01
    • 2020-02-21
    • 1970-01-01
    • 2016-04-12
    • 1970-01-01
    相关资源
    最近更新 更多