Kendo Grid custom cell with row selection

7 posts, 2 answers
  1. Matej
    Matej avatar
    71 posts
    Member since:
    Jun 2019

    Posted 09 Jan 2020 Link to this post

    Hi,

    I have a Kendo Grid with a custom cell and row selection. When I add <div> to my custom cell than onRowClick is ignored. What is the proper way to enable onRowClick in my custom cell?

    example https://stackblitz.com/edit/react-4v6l81

  2. Answer
    Stefan
    Admin
    Stefan avatar
    3034 posts

    Posted 10 Jan 2020 Link to this post

    Hello, Matej,

    Thank you for your example.

    This is expected as we have an internal check for the event target before firing the onRowClick event. This is mainly made if the user clicks inside an input or checks a checkbox.

    When the cell is custom, the developer has full control over the rendering and can attach the click over the td element programmatically.

    This is the updated example showcasing this:

    https://stackblitz.com/edit/react-4v6l81-uujhmt?file=app/main.jsx

    I hope this is helpful.

    Regards,
    Stefan
    Progress Telerik

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. Matej
    Matej avatar
    71 posts
    Member since:
    Jun 2019

    Posted 10 Jan 2020 in reply to Stefan Link to this post

    I noticed that you are passing an onSelectionChange method from a grid to a custom cell as selectionChange https://www.telerik.com/kendo-react-ui/components/grid/api/GridCellProps/#toc-selectionchange. Will any similar option be available for onRowClick in the future?
  4. Stefan
    Admin
    Stefan avatar
    3034 posts

    Posted 13 Jan 2020 Link to this post

    Hello, Matej,

    Thank you for the suggestion.

    The main reason is that calling the props.onRowClick is similar to programmatically calling the handler this.handleOnRowClick.

    We will have this in mind for future versions, the feedback is highly appreciated.

    Regards,
    Stefan
    Progress Telerik

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  5. Matej
    Matej avatar
    71 posts
    Member since:
    Jun 2019

    Posted 16 Jul 2020 in reply to Stefan Link to this post

    Hi,

    can you again consider adding the onRowClick  as a GridCell prop? I have MyGrid shared component with all my select/multiselect logic there and I am passing all columns as a child to this component. Now my CustomCell does not have access to the this.onRowClick because CustomCell  is defined outside of the MyGrid component.

  6. Answer
    Kiril
    Admin
    Kiril avatar
    24 posts

    Posted 20 Jul 2020 Link to this post

    Hello Matej,

    We are looking forward at adding the `onRowClick` property for a future version of the `@progress/kendo-react-grid` package.

    It is currently possible to call the `onRowClick` handler without this property, by utilising the React Context API and passing the callback through a `Context.Provider`

    I have prepared the following stackblitz example, which demonstrates calling the `onRowClick` callback through the Context API, when your custom cell is defined outside of the App component:
    https://stackblitz.com/edit/react-4v6l81-gngdtt

    Please let me know if you need further assistance.

    Regards,
    Kiril
    Progress Telerik

  7. Matej
    Matej avatar
    71 posts
    Member since:
    Jun 2019

    Posted 20 Jul 2020 in reply to Kiril Link to this post

    Awesome, Thank you!
Back to Top