Server Side Grouping

[Ali]

hi, 

i am working on server side pagination and grouping, i am using the example below in giver url,

https://www.telerik.com/kendo-react-ui/components/dataquery/mvc-integration/

when i implement this example in my code its working fine with pagination, filtering and sorting, but when i am try to group data

my UI showing nothing. can you please give an example with server side grouping and pagination?

[Konstantin Dikov]

Hello Ali,

For enabling the grouping you will have to set the "grouping" property to "true", but also set the "group" property of the Grid to the current group expression:

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

In the context of the example with the MVC integration, you will have to add the following:

                <WrappedGrid
                    filterable={true}
                    sortable={true}
                    pageable={{ pageSizes: true }}
                    {...this.props}
                    total={this.state.total}
                    data={this.state.data}
                    groupable={true}
                    group={this.state.dataState.group}
                    skip={this.state.dataState.skip}
                    pageSize={this.state.dataState.take}
                    filter={this.state.dataState.filter}
                    sort={this.state.dataState.sort}
                    onDataStateChange={this.handleDataStateChange}
                />

Another option is to configure the Grid to use the DataState directly (instead of setting the skip, pageSize, filter, sort, group explicitely). The following example demonstrates how to integrate the DataState in the Grid (the same is applicable for the server-binding as well):

• https://www.telerik.com/kendo-react-ui/components/grid/data-operations/local-operations/

Hope this helps.

 

Regards,
Konstantin Dikov
Progress Telerik