Some Tricky Works With Kendo Grid

3 posts, 0 answers
  1. Rohullah
    Rohullah avatar
    11 posts
    Member since:
    Feb 2018

    Posted 04 Apr 2020 Link to this post

    hello

    i have some questions about kendo react grid 

    1-how to hide some columns 

    2-how to auto adjust width columns to content size

    3-dynamically refresh kendo grid data

    4-dynamically 

    thanks...

     

  2. Rohullah
    Rohullah avatar
    11 posts
    Member since:
    Feb 2018

    Posted 04 Apr 2020 Link to this post

    EDIT:

    4-How to Dynamically Disable/Enable Grouping Grid

    5-How to add checkbox for select some  or all records

    thanks...

  3. Stefan
    Admin
    Stefan avatar
    3008 posts

    Posted 06 Apr 2020 Link to this post

    Hello, Rohullah,

    Regarding the questions:

    1) how to hide some columns - This can be done by changing the collection of columns passed to the Grid. We have a demo showcasing this:

    https://www.telerik.com/kendo-react-ui/components/grid/columns/column-menu/#toc-custom-components

    2) how to auto adjust width columns to content size - I can suggest using a method to calculate with a width of the rendered text(I used a third-party library called calculate size). Then set the width of the column to a function that will calculate the width of the longest text and set it. I made an example showcasing this:

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

    3) dynamically refresh kendo grid data - This will be done automatically if the Grid data is bound to the state. When the state is changed the Grid will update as well.

    4) How to Dynamically Disable/Enable Grouping Grid - Bind the groupable value to a value in the state, when the value changes the groupable property will change as well:

    5) How to add a checkbox for select some  or all records - Please check the selectable article of the Grid, the second example is with checkboxes:

    https://www.telerik.com/kendo-react-ui/components/grid/selection/

    In general, the KendoReact Grid follows the ReactJS concepts, it only shows data and properties based on the properties that it receives. This is valid for all of its properties if the property is part of the state and the state changes, the Grid will be rendered with the new value of the property (groupable, filterable, resizable, etc).

    I hope this is helpful.

    Regards,
    Stefan
    Progress Telerik

    Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
    Our thoughts here at Progress are with those affected by the outbreak.
Back to Top