Hi there,
I'd like to turn off even/odd row highlighting for the Grid and use cell border instead. Also I'd like to change row height (smaller then default), rowHeight property doesnt' really help with that.
I can do it by learning kendo css classes and override particular properties for certan classes but... I have many different vendors for different components and it's so a pitty to learn all the css classes hell...
It'd be supper cool to have something like turnOffAlternation and showCellBorder attributes on the Grid.
p.s. I easily predict answer but at least I gave a try :)
1 Answer, 1 is accepted
Hello Oleksandr,
As you have correctly stated, using custom CSS for overriding the default styles is one option. Another option is to handle the rowRender and modify the rendering of the rows as shown in the following example:
For removing the alternating rows you can use the follow rowRender, which will remove the "k-alt" class:
const rowRender = (trElement, props) => {
const trProps = {
className: trElement.props.className.replace('k-alt', ''),
};
return React.cloneElement(
trElement,
{ ...trProps },
trElement.props.children
);
};As for the borders, you can use the following CSS selector:
<style>
.k-grid table .k-master-row td{
border-bottom: 1px solid #888;
}For the rowHeight, note that there is padding applied to the cells, so setting values under specific height will not be applied. You can override the padding in order to allow lower hight:
<style>
.k-grid table .k-master-row td{
border-bottom: 1px solid #888;
padding: 3px 5px;
}Finally, for feature requests, please use our public feedback portal, where other developers can vote for them:
Regards,
Konstantin Dikov
Progress Telerik
Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.
Rank 1
That exactly what I was talking about and how I did, but for simple things it should be more straightforward, for instance DevExpress grid has showBorder and columnAutoWidth properties, quite simple and general capabilities that somewhy not exist in Kendo :)
I'm evaluating KendoReact and of course I won't submit any feature requests.
Thank you for help Konstantin
Hi Oleksandr,
We totally agree that adding properties for changing specific behavior or rendering is the way to go and this is why we always take into account the demand for certain features. The KendoReact suite was started with the main idea that it will provide an easy way for the developers to customize components by exposing custom rendering options, but after the initial push in that direction, now the suite is in a stage of providing properties for simple and out-of-the-box customizations.
Notwithstanding, please let me know if we can log the requests from your behalf for introducing "showBorders" and "alternatingRows" properties. Both of them will be useful and I am sure the feature request will receive many votes.
Rank 1
Here is a link to the feature request that I have created on your behalf: