When i select a row in a grid, and press a delete key in a keyboard, it is not deleting. onKeyDown event is not triggering.
Please help me to resolve this issue.
Thanks.
Arun
The Grid column menu does not close correctly. When I click the three-vertical-dots icon, it opens just fine. If I click the three-vertical-dots icon again to close it, it begins to close on the mouse down event, but then opens again on the mouse up event. You can close/collapse it completely by holding down the mouse button for a second or two, but as soon as you release the mouse button, it expands back open again. This can easily be reproduced with the examples here:
https://www.telerik.com/kendo-react-ui/components/grid/columns/column-menu/
To close the menu, you can't use the three-vertical-dots icon. You instead need to click somewhere else on the page, which closes the menu. You can also click either the Clear or Filter buttons and that will close the menu as well.
I'm using GridColumnMenuCheckboxFilter. I searched for a long time for a solution to this, but I didn't find any mentions of the problem. I've noticed that older examples on stackblitz that use older Kendo versions do not have this problem. With the older versions, you can click the three-vertical-dots icon once to open the menu, and once again to close the menu, as you'd expect.
Hi,
Is there existing functionality to select all items in the MultiSelect control, or does this have to be implemented using custom logic? There is already an 'X' that appears within the control once a selection has been made that clears all selected items, so an integrated select all would be preferable to a custom external button.
Kind regards,
David
Is it possible to add the grab icon when hovering over (cursor: grab;) a Column Header and the grabbing icon when reordering (cursor: grabbing;) like it is done for the reordering of the tile layout?
https://www.telerik.com/kendo-react-ui/components/layout/tilelayout/tiles/#toc-reordering
It looks like it would need .k-cursor-grabbing added when moving and .k-cursor-grab when hovering.
The issue I had with applying the cursor:grab and cursor:grabbable to the active .k-header is that while you are dragging a column on top of another column, you lose the grabbing icon and you get the open hand because you are hovering over another column. EVEN though you haven't dropped the column yet.
Hi Team,
According to the Kendo React documentation, when the width of a grid column is set to undefined (and any such columns are AFTER columns that have defined set widths), that column (or set of any such columns) should take up the remaining space in the grid and resize as the grid is resized. This is working correctly when the grid is initially rendered.
However after this initial rendering we allow the user to manually resize the grid column (which also works correctly) and then we have a sort of "reset" action which sets the grid column's width back to undefined (with the expectation that the grid column would revert back to the original behavior of taking up the remaining space in the grid and resize proportionally as the grid is resized).
It is this resetting of the grid column's width back to undefined that is not properly re-rendering.
Is this a known issue? We are working with version 4.3 of the Kendo React grids but are looking to upgrade to 4.7 soon; would it happen to be fixed in 4.7?
Thanks in advanced.
Jacob Yeh
Hi Team,
I have a ComboBox that and my use case is that when a user types into it, it will send a request to a server to get the search results and set the data, for the user to then select. So a server filter, kind of.
The problem is that onFilterChange is triggered on each keypress which in turn sends a request to the server each time. I would like to debounce the request to the server until the user has stopped typing, but I cannot find a debounce function that works. I know how to use useEffect and useRef, but the refVarialbe.current doesnt update on filterChange, only on value change. Which is not my use-case.
Attempts: https://stackblitz.com/edit/react-pht5mn?file=app%2Fmain.jsx
Has anyone had any success with this?
Please advise.
Thanks,
Grant
Hi,
I was looking into the OData example (TypeScript with Hooks) of the Grid (https://www.telerik.com/kendo-react-ui/components/grid/data-operations/odata-server-operations/) and I noticed that the typing is invalid. In "products-loader.tsx" the callback function has only the products array as argument, but when that function is called later on, it has a "data" and a "total" property.
When you then add some code in the "dataReceived" function in "main.tsx" (for example iterating the products"), you'll get errors since the data coming from the "products-loader" isn't an array of products, but an object with "data" and "total".
Could you look into that (and maybe provide a correctly typed example here)?
I have one normal button trying to implement customized upload button when click import button one popup should be opened to select file ones file selected should be saved in share path and need to validate each cell and add in db table .
Kindly suggest any solution for customized upload button
<button id='btnImport' className='k-button k-button k-button-Blue'> {" "} Import{" "} </button>
We are Using Kendoreact Editable Grid which have Gridcolumn like Name in grid
<GridColumn
field='Name'
title='Name'
width='150px;'
filter='text'
editor='text'
className='k-grid-textbox'
</GridColumn>
how to validation each cell on entering should not be more than 100 letters and show error in same cell inside grid.
I also tried checking for cell and onblur which is not working and getting error in existing flow. Please help how to validate grid cell when entering and show error message in same cell.