GridToolbar as a custom component.

1 Answer 202 Views
General Discussions Grid
Daniel
Top achievements
Rank 1
Iron
Iron
Daniel asked on 24 Mar 2022, 07:28 PM

Hi.

I'm trying to do a custom GridToolbar that will serve many data grids but it won't render, what is the problem and how I can do it?

stackblitz example

 

Thanks.

Daniel
Top achievements
Rank 1
Iron
Iron
commented on 27 Mar 2022, 03:00 PM

???

1 Answer, 1 is accepted

Sort by
-1
Filip
Telerik team
answered on 28 Mar 2022, 10:17 AM

Hello, Daniel,

A possible solution would be to render the custom component outside of the grid, like shown here:

https://stackblitz.com/edit/react-xkpzbe-vgjuiy?file=app/main.jsx


This way the component is rendered properly.

I hope this helps.

Regards, FilipProgress 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/.

Daniel
Top achievements
Rank 1
Iron
Iron
commented on 28 Mar 2022, 05:57 PM | edited

Yes, great thanks.

Can I ask another question please:

I use a data grid inside the reactstrap Collapse component that shows in a reactstrap Modal component,

It works fine until I close the Modal and then the app crash with the errors:

1. "Uncaught TypeError: Cannot read properties of null (reading 'nodeType')".

2.

It happens only when I use the data grid if I replace it with other elements it won't happen.

Do you know what could cause this issue?

Filip
Telerik team
commented on 29 Mar 2022, 12:49 PM

Hi, Daniel,

I made a small example using the Grid inside of a reacstrap modal, but the error did not reproduce:

https://stackblitz.com/edit/react-xkpzbe-wthy7u?file=app/main.jsx

Can you provide a working example that reproduces the errors so that I can inspect further?

Regards,
Philip



Daniel
Top achievements
Rank 1
Iron
Iron
commented on 03 Apr 2022, 06:39 AM

Hi, thanks to your example I notice it is a package version issue.

1 more question please:

It is possible to make the operator isempty to catch empty strings and null values?

Filip
Telerik team
commented on 05 Apr 2022, 03:03 PM

Hi, Daniel,

The operator cannot be modified, however, you can use two separate operators,  isnull to catch null values and isempty. 

More information on text operators can be found here:

https://www.telerik.com/kendo-react-ui/components/datatools/api/Operators/#toc-text

I hope this helps.

Regards,
Filip

Tags
General Discussions Grid
Asked by
Daniel
Top achievements
Rank 1
Iron
Iron
Answers by
Filip
Telerik team
Share this question
or