Use arrays to set className for multiple indentures in RowGroup
Use arrays to set className for multiple indentures in RowGroup
Loren Maxwell
Posts: 387Questions: 94Answers: 10
First -- RowGroup had no category here in the forum!
Anyway, when setting rowGroup.className for a multiple-level RowGroup, the classes are applied to all the levels.
Would like to have an ability to set different classes for each level using arrays:
rowGroup: {
dataSrc: [
"first-level",
"second-level"
. . .
],
className: [
["first-level-class", "another-first-level-class"],
["second-level-class", "another-second-level-class"],
. . .
]
}
Something similar should be implemented with rowGroup.startClassName, rowGroup.endClassName, and rowGroup.emptyDataGroup as well.
Replies
I'm not sure if you've noticed, but there are built in classes at each level - "dtrg-level-x" - would you be able to use that?
Colin
Thanks, @colin -- I could, but I'm using Bootstrap and was hoping for a simple way to apply an existing class from a framework to a group row instead of doing custom css to modify the "dtrg-level-x".
Another issue is that if I use className at all, then all those classes are applied to all row groups although I might only want them applied to a specific level.
I thnk maybe what Colin is suggesting is to use the group level classname (dtrg-level-x) is the selector for something like jQuery addClass(). I would look at doing this in the
drawevent.Kevin
I was thinking about it and maybe Colin wasn't suggesting the above. Also the
drawevent might fire before the rowGroup rows are inserted into the page. If so then userowGroup.startRenderand/orrowGroup.endRenderto apply the class based on thelevelparameter.Kevin
This example shows how to add a class based on the group level:
http://live.datatables.net/hituyela/1/edit
Depending on the Bootstrap CSS it may or may not override the rowGroup CSS. For example remove
!importantfrom the CSS in my example and it won't override.BTW, the
drawevent fires before Datatables inserts the rowGroup rows so my first suggestion won't work.Kevin
Thanks, Kevin -- great example and I'll definitely be referencing this!
However the required use of !important in the custom css highlights the need for a different approach when it comes to adding classes from a css framework.
For now I'll end up just removing the preset dtrg-level-x class and adding the Bootstrap classes in startRender, but I'm keeping my fingers crossed for a long term solution along the lines of what I'm proposing!