Telerik Forums
KendoReact Forum
1 answer
168 views

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

Stefan
Telerik team
 answered on 05 Aug 2021
1 answer
337 views

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.

Stefan
Telerik team
 answered on 05 Aug 2021
1 answer
76 views
I needs to share master grid header with detail grid data. Then if resize the master grid column, detail grid column not get aligned. but it should aligned depends on master column
Stefan
Telerik team
 answered on 05 Aug 2021
1 answer
156 views

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

Stefan
Telerik team
 answered on 04 Aug 2021
1 answer
456 views

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.

Ina
Telerik team
 answered on 04 Aug 2021
1 answer
355 views

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

Stefan
Telerik team
 answered on 04 Aug 2021
2 answers
1.0K+ views

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

Grant
Top achievements
Rank 3
Iron
Iron
Veteran
 answered on 03 Aug 2021
1 answer
322 views

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)?

Stefan
Telerik team
 answered on 03 Aug 2021
1 answer
513 views

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>

Stefan
Telerik team
 answered on 03 Aug 2021
1 answer
1.3K+ views

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.

Stefan
Telerik team
 answered on 02 Aug 2021
Narrow your results
Selected tags
Tags
+? more
Top users last month
Henri
Top achievements
Rank 2
Iron
Iron
Iron
SUNIL
Top achievements
Rank 2
Iron
Iron
Iron
David
Top achievements
Rank 1
Jackson
Top achievements
Rank 1
Iron
Iron
Tim
Top achievements
Rank 3
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Henri
Top achievements
Rank 2
Iron
Iron
Iron
SUNIL
Top achievements
Rank 2
Iron
Iron
Iron
David
Top achievements
Rank 1
Jackson
Top achievements
Rank 1
Iron
Iron
Tim
Top achievements
Rank 3
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?