javascript - ag-grid 中的行分组

标签 javascript row ag-grid

在我的表中,我正在使用分组行,但我需要设置组的长度数字的样式,在显示的示例中,组标签类似于“+Title grouo (3)”。 我需要设置“(3)”的样式,例如放置一个 bootsrap 标签。

如何设计它的样式?

最佳答案

ag-grid 非常强大,并且有很多定制选项。我没有使用过企业版,所以没有像我应该回答你的问题那样使用行分组选项。然而,这是我发现的。

有一个cellRenderer如果您决定为组本身创建一个特殊的列,则可以使用该列。该单元格渲染器允许您根据需要自定义 html,并且是 Group 列的 columnDefs 的一个属性

或者,如果您选择让组使用整行而不为组提供单独的列,则可以使用 groupRowRenderer or groupRowInnerRenderer callback which are attributes of the gridOptions .

Here是 ag-Grid 提供的一个示例,它使用 groupRowInnerRenderer,似乎与您正在寻找的类似。

最后,如果您正在寻找最快、最简单的选项,您可以使用 jQuery或正常DOM lookups找到类 ag-group-child-count ,它将为您提供一个 span 元素数组,您可以对其进行操作以获得所需的正确 Bootstrap 样式

TL;DR

这样做:

document.getElementsByClassName("ag-group-child-count").add("bootstrap-label")

关于javascript - ag-grid 中的行分组,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39491785/

相关文章:

javascript - OnClick后的返回值

html - 带有 css 选择器的表行扰流板

python - 如何确定任何列是否具有特定值

ag-grid 在渲染后不会滚动

javascript - 隐藏一个元素并同时更改样式 css

javascript - 数据未显示在下拉列表中

javascript - 在控制台上绘制 HTML5 Canvas

python - 填充行时更改Excel文件中的行

javascript - ag Grid - 如何隐藏动态生成的列

javascript - 如何在处理节点时设置ag-Grid中的单元格样式?