I need to have a custom CSS class attached to rows, based on the content of the row. For example, most rows might have a class “Normal” but a few rows might need the class “Important” based on a field on that row.
To make this even a bit harder, this happens in a drawer - which means the table doesn’t render until the drawer is expanded.
I attempted to do this from a custom field renderer, which I would take the element of the field, and locate the parent “TR” element so I can assign the class there. However, at the time of field rendering the element is not attached to the table, so I’m unable to traverse to the parent.
What would work is if there is an event I can attach to that would signal either when a row is fully attached to the DOM, or provide the row DOM element, or even signal me when the entire table is attached to the DOM (and I could then pass over the model, locate the elements for each row and locate the parent TR element to adjust the CSS class).
Any thoughts on how I might accomplish this? I don’t see an appropriate event to use (for example, a “table-rendered” event or a “drawer-rendered” event).
For a future idea, it woudl be great if would could attach CSS (using moustache) to a row element, in which case this would become easy!
Thanks!!
- Chris
Question
Changing a row's CSS class on a row-by-row basis in a table
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.