Rank 1
Iron
Hi,
I'm aware there is a cellRender method. There is also a rowRender method.
In our project we allow users to style fields, for example the user might set a specific field/column to have a background colour of red. I do this in the cellRender method.
But what is the user wants to highlight an entire row (so each field/column has a background colour)? I wondered if we could use the rowRender to achieve this.
I have got the desired effect but am wondering if this is considered bad practice? Is this okay or is it better to add more logic to the cellRender method?
const rowRender = (tr, props) => {
// In this basic example, the second row of the grid has all it's cells coloured red. It'll obviously be more complex than this
if (props.dataIndex === 1) {
props.children.forEach((cell, i) => {
props.children[i] = React.cloneElement(cell, {...applyStyle({backgroundColour: '#ff0000'})});
});
...1 Answer, 1 is accepted
Hello,
We can confirm that this is a good practice.
If something affects the entire row, the rowRender prop is the recommended place to do it.
For that specific use case, you can also apply a className to each row that has to be styled and then used CSS to apply the styles to each cell. Still, this is only a suggestion you can find the best approach knowing all business requirements:
.my-red-row td {
background-color: red
}Regards,
Stefan
Progress Telerik
Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.