ag-grid 有 header 个组时无法移动列

Question

我正在使用带有普通 JS 的 ag-grid 社区版本。使用 header 组时，我无法将列移动到指定索引。具有 header 组的列未以编程方式移动。但是，我可以用鼠标拖动来移动它们。有办法解决这个问题吗？

我正在使用这条线移动：

gridOptions.columnApi.moveColumns(['gold','silver','bronze','total'], 0);

这是带有完整示例的 plunker 演示：link

在我的真实示例中，我永远不会将列从他们的组中分离出来，因此我可以重新定义所有具有指定顺序的 header，但效率不高。

Answer 1

阅读文档：

Moving Columns and Groups If you move columns so that columns in a group are no longer adjacent, then the group will again be broken and displayed as one or more groups in the grid.

Answer 2

在您的列定义中，您可以使用名为 marryChildren 的选项。这将使 children 保持在一起，这样它们就不会被移出组。

var columnDefs = [
    {field: 'athlete', width: 150},
    {field: 'age'},
    {field: 'country', width: 150},
    {field: 'year'},
    {field: 'date'},
    {field: 'sport'},
    {field: 'gold'},
    {field: 'silver'},
    {field: 'bronze', marryChildren: true,  children:[{field: 'xd'}, {field: 'xd2'}]},
    {field: 'total'}
];

ag-grid 有 header 个组时无法移动列

ag-grid can not move columns when having header groups

html

javascript

ag-grid