Hi,

I have a reusable component that contains a grid but I would like to be able to pass additional <GridColumn /> definitions from consuming components to the reusable component. I'm not sure of the correct way to do this in Typescript. The best way I've come up with so far is to define props for column(s) before and after the fixed content as follows:

preColumns?: React.ReactNode | undefined;
postColumns?: React.ReactNode | undefined;

however in order for this to work properly the consuming component has to pass an array of <GridColumn /> and set a key on each of them e.g.

postColumns={[
    <GridColumn key="information" title="Information" width={160} cell={cellHelper.getInformationCell} />,
    <GridColumn key="lastUpdatedBy" field="lastUpdatedBy" title="Updated By" width={200} />,
    <GridColumn key="lastUpdatedDatetime" field="lastUpdatedDatetime" title="Updated Date" width={250} format={GlobalHelpers.DatetimeFormatForKendo} />,
]}

The disadvantage of this is having to define a key and also that I can't specify a prop for a single column only. Is there a recommended approach in order to achieve this?

Kind regards,

David

Hey there,

I wanted to see if Kendo allows for any colgroups to be used in the grid? I'd like to visually group together four columns but not actually group their values together in new buckets (if that makes sense) - any ideas other than custom-render each cell and headerCell for the columns I want to visually group together?

Thank you in advance!

Hi,

If you set a Grid as both navigatable and scrollable="none" then it results in an error: "Cannot read properties of undefined (reading '0')". This can be demonstrated by adding these properties to any of the examples on the kendo site e.g. https://www.telerik.com/kendo-react-ui/components/grid/get-started/ 

Kind regards,

David

hi,

So, I have a question in regards to in-cell editing of kendo grid. Is it possible to introduce custom components like textfield when you are editing a cell.

Setting a width on a Input component doesn't seem to work:

<Input label="Something" width={1} />

Renders to:

The code in the DOM looks like:

All the other input components (like "NumericTextBox") have the width property applied on the containing <span>, but for an Input, the containing span has always a width of 200.

Any suggestions on how to set the width of an Input properly?

Working with kendo bootstrap 4.35.1, I'm having an issue with expand row not returning k-i-plus icons, and getting k-plus icons (which either don't exist or don't render correctly. In the top picture the plus icon should be to the left of the checkbox. When clicked, the icon class name does change from k-plus to k-minus, but I can't seem to get it to render k-i-plus.

Hi,

In kendo react components, specially in react grid. Do we have some thing for saving user preferences and layout,

Hi,

As my question says, I would like to know, how can I limit the depth that a TreeView expands to?

Consider the data object below, that lists geo-locations, there is only 3 levels, but i cannot have a treeview display 4,000 cities when the user expands a province. Im displaying that data in a grid elsewhere.

My question is as follows: I cannot separate the cities into a separate list due to other functionality, but the TreeView will try to render any node 'items'as children, How can I instruct the TreeView to limit the depth to 1 layer, ie, I sened it data and of the objects it only looks at the first set of objects' items.

const data = [
  { 
    name: 'Country' ,
    items: [
      { 
        name: 'Province-1',
        items: [
          ... 4,000 cities names
        ]
      },
      { 
        name: 'Province-2',
        items: [
          ... 5,000 cities names
        ]
      },
      ...
    ]
  }
]

Thanks,
Grant

Detail grid is not loading when I use checkbox column in kendo grid.

Could you suggest what may be the reason it is breaking.

If I remove checkbox column from my data then detail is working fine.

Hey there,

Just wanted to inquire and see if the onMouseUp event is available for the DropDownList KendoReact component?

Thank you in advance!