Put a React Link Element Inside Your Grid Column - How? Example?

2 posts, 0 answers
  1. Jason
    Jason avatar
    2 posts
    Member since:
    Jul 2020

    Posted 31 Oct 2020 Link to this post

        Hello,

      I need to stick a React Link element inside a column in your React Grid.  I have tried setting the widget on the cell prop as your documentation suggests, but cell is not correctly seen.  Do you have a quick example of how I can do this or a link to documentation that is current and correct?

      I have your Grid populated with data and in the same column in each row I want to clickable Link element that will navigate to a View page to see the details in a nice form of the row on which the Link was clicked.

      Thanks,

      Jason

  2. Stefan
    Admin
    Stefan avatar
    3034 posts

    Posted 02 Nov 2020 Link to this post

    Hello, Jason,

    This can be done using the cell property of the Grid column:

    https://www.telerik.com/kendo-react-ui/components/grid/api/GridColumnProps/#toc-cell

    Then in the props, there is information for the row data, and we can use it to make dynamic links based on the name, id, or any other field. The example is made for the ID column as with this data is more link friendly:

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

    Also, you can open a Form to edit the clicked item directly in our Dialog component as shown in this demo:

    https://www.telerik.com/kendo-react-ui-develop/components/grid/editing/editing-external-form/

    I hope this is helpful.

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

Back to Top