Imaging a GridColumn field that is a simple object {name:"My Item", value: 123}. It would be great to be able to define properties of the object as what to display without having to build a custom renderer.
displayField/displayFunction as a callback function with the fieldName of the columns and the dataItem of the row as parameters
const nameDisplay = (field, dataItem) => {
return "some value"
}
...
<GridColumn field={"name"} displayFunction={nameDisplay}
Hi,
Please see the following example of the Upload component being used to transfer a single file to a byte array:
https://stackblitz.com/edit/react-u2kbu9?file=app/main.tsx
Notice that all packages are latest including react 18 but I have not switched to the new createRoot API, and as per react documentation "Until you switch to the new API, your app will behave as if it’s running React 17" - this warning can be seen in the console window. When you upload a file, the FileReader onprogress and onload events result in the file being successfully uploaded with 100% progress. You can see current state and new state of all events in the console window.
Now please see the exact same example but switched to the new createRoot API:
https://stackblitz.com/edit/react-y8fuya?file=app%2Fmain.tsx
Notice that the warning is no longer visible in the console window. When you upload a file, the FileReader onprogress and onload events result in the file being successfully uploaded but the file progress is overwritten. You can see current state and new state of all events in the console window - the new state from the onProgress event is lost, and the new state in the onStatusChange event reports zero progress.
I believe this is because of automatic batching in React 18.
Kind regards,
David
1) Drag a window to a tabstrip and drop the window on the tab area.
2) The window should dock into the tabstrip as extra tab.
Hi,
Can We have an admin Dashboard for KendoReact? which has some ready components Like NavBar on top and Left, Dark and Light mode, RTL, and LTR Layouts and Forms with all input Components
I Have More projects in this React MUI Admin Dashboard and now it's very hard for me to use the KendoReact Components here.
if we Have KendoReact Admin Dashboard like that it will be easy to use KendoReact components there.
Thanks
Hello,
There is a very serious bug in the Kendo React date picker component: the month of January is simply not displayed
The issue can be witnessed on your demo page:
https://www.telerik.com/kendo-react-ui/components/dateinputs/datepicker/
Just open the picker and you'll see January is not there
https://stackblitz.com/edit/react-haejnu?file=app%2Fmain.tsx%3AL115
It is a common use case to provide Grid's dataItemKey property to make sure changes are properly reflected per documentation - https://www.telerik.com/kendo-react-ui/components/grid/api/GridProps/#toc-dataitemkey
However, when this accessor property is provided (usually a unique ID on all groups and items), Kendo uses it instead of its default auto-incremented `'ai' + absoluteIndex` key to index the <GridRow /> for each group's header and footer - giving them the same value and causing React to throw multiple warning about duplicate keys. This makes it unreliable to specify dataItemKey property when using the grouping feature with aggregate footers as it messes up with React's reconciliation mechanism.
How to reproduce (video attached):
1) open combobox
2) scroll to end of the item list
3) select last item 4999
4) open combobox again
Expected behavior: I would like to see the item list.
Actual behavoir: I see white area.
https://www.telerik.com/kendo-react-ui/components/dropdowns/combobox/virtualization/#toc-basic-configuration
https://www.telerik.com/kendo-react-ui/components/dropdowns/multiselect/virtualization/#toc-basic-configuration
https://www.telerik.com/kendo-react-ui/components/dropdowns/dropdownlist/virtualization/#toc-basic-configuration
Due to some recent need (remove the filter buttons) in a Grid I think that having the ability to provide a className for the filter of a column would be very usefull.
is that possible to change the background line (grid )
how can I change the color of the grid or invisible in the kendo UI chart
I am using KendoReact Draggable and Droppable and we find a bug when using it. This bug even happen in the official demo.
The bug is described below:
When a droppable area is rendered out of the originall window size, the droppable cannot detect the onDragEnter() & onDropLeave(), of course onDrop neither.
it seems that kendo did not handle when user scroll while dragging the draggables, so that when the draggables was dragged to a zone out of the original window size, it failed to detect it.(Figure4)
I have also found another bug which is when you drag the draggables and scroll, the draggable will somehow detacted with the cursor, but I somehow already fixed it. Maybe it gives some hint for you to fix this bug, maybe.
Hello,
I am using Filter component from kendo-react-data-tools and I need to parse oData filter string in URL to initialize the filter component. Is there a way to convert oData string to filter data that Filter component can use ? I am using toODataString to convert filter to oDataString and I am looking for the opposite way。
Thanks,
Rita
It doesn't possible to set different "no events" text for the Agenda component, can we add the ability to set it by prop like in the example below?
<Agend noEventMessage="No meetings" />
<Agend noEventMessage="No vacations" />
Hello,
Currently, it is possible to switch between both numeric and input types in Kendo grid pagination but in our application we have design to display both numeric and input control types on load. so request to please help with that feature.
Thanks
It would be nice to have natively some kind of copy-paste of data between excel and kendo
more and more clients are requesting this feature but currently it is pretty difficult to implement..
being more specific the expected behavior should be:
user copying a range of cells from excel
pastes it into a grid cell
data should spread starting from the cell where it was pasted and inserting new rows if there are not enough to contain all the content
then user should be able to copy a range of cells/rows or a single row and paste it to excel
Current Behaviour
When a table is created in the text editor and multiple columns are selected an error is thrown.
Errors:
TypeError: Cannot read properties of undefined (reading 'localsInner')
TypeError: Cannot read properties of undefined (reading 'eq')
Expected Behaviour
When a table is created in the text editor and multiple columns are selected an error must not appear and the user must be able to merge or split the cells.
MInimal Reproduction
I'm providing a reproduction from Kendo React code examples.
https://stackblitz.com/edit/react-su15wr?file=app%2Fmain.tsx
Package
"@progress/kendo-react-editor": "^5.11.0"
Actual Result:
Given I have a conteneditable div component in my web application, when I run FastPass using Accessibility Insights for Web, I get the follow error message:
Snippet
<div aria-label="Post a question or answer" contenteditable="true" class="ProseMirror"><p data-prewrap="true"><br></p></div>
How to fix
Fix the following:
ARIA attribute cannot be used, add a role attribute or use a different element: aria-label
Given I have a conteneditable div component in my web application, when I run FastPass using Accessibility Insights for Web, then I should not receive the following error message above