OData Server Operations

Premium

You can bind the Grid to data and then sort, filter, or paginate it using the OData service.

To apply the data operations on the server, you need to:

1. Process the parameters by utilizing the toODataString function, which is part of the Data Query package. This function converts the Grid's state into an OData-compliant query string.

2. Configure the KendoReact Grid to use DataState. The DataState contains information about the current page, filter and sort expressions, grouping, and aggregates.

3. Handle the onDataStateChange event. When this event is triggered, it returns the DataState object, which you will use to track the current state of the Grid.

4. Use the toODataString helper method with the current DataState to create the OData query string. This query string will be used to request data from the server.

Note that the toODataString helper method does not support grouping. To add grouping information in the query, you can use the generated query string and manually include the grouping information by using the group descriptors within the DataState.

The following example demonstrates how to request and process data by handling the onDataStateChange event. In addition, the sample also shows how to:

• Separate the data request and response logic from the declaration of the Grid.
• Debounce the event to avoid multiple requests at the same time.
• Show a loading panel over the Grid during data fetching.

Change Theme

Theme

Loading ...

Suggested Links

• React Data Grid
• Data Query Overview
• API Reference of the Grid
• API Index of the Grid