1 Answer, 1 is accepted
Hello,
Straight to the points:
If we want to prevent locked columns from being reordered we could set orderIndex to the column as it is described in this KB article - https://www.telerik.com/kendo-react-ui/components/knowledge-base/grid-disable-reordering/
The change in the icon we could use the IconsContext.Provider as for example it is done in this example - https://www.telerik.com/kendo-react-ui/components/common/svgicon/customization/#toc-built-in-svg-icons-customization
In order to update the correct item on hover I have added a headerCell to the locked cell as below:
cells={{ headerCell: HeaderCustomCell }} const [dropIcon, setDropIcon] = React.useState(plusIcon);
const HeaderCustomCell = (props) => (
<HeaderThElement
columnId={props.thProps?.columnId || ''}
{...props.thProps}
onMouseEnter={() => {
setDropIcon(minusCircleIcon);
}}
onMouseLeave={() => {
setDropIcon(plusIcon);
}}
>
{props.children}
</HeaderThElement>
);Here is an example that I created in stackblitz - https://stackblitz.com/edit/react-qmu2xm-s7awrl?file=app%2Fmain.jsx
Regards,
Plamen
Progress Telerik
Stay tuned by visiting our public roadmap and feedback portal pages! Or perhaps, if you are new to our Kendo family, check out our getting started resources!
Rank 1
Thank you for the quick response!
My requirement is for the unlocked columns not to be able to be dropped on the locked columns. In the reference article you mentioned, when "On Order" column is dropped on "Id" column which is locked , the "On order" column settles in the first position after the locked columns. I want the "On order" column to go back to the same place as it was earlier and prohibit dropping of unlocked columns on the locked column area. Is there a way to do this?
It seems like this is currently not possible with the component. I have logged it as bug at our side and you can follow its progress here - https://github.com/telerik/kendo-react/issues/2280
Thank you for reporting this issue and for your concern with KendoReact and please excuse us for this inconvenience caused.
If you observe other issues please don't hesitate to share them, too.