Skip to main content

Introduction

Connecting to a database is a common task in any application. In this tutorial, we will learn how the built in features of the React Data Grid can help us manage this interaction.

There are two modes of getting data from the server - Client Mode and Server Mode. In Client Mode mode, the data is loaded into the grid at once. In Server Mode mode, the data is loaded in chunks as the user interacts with the grid. The React Data Grid supports both modes.

Client Mode

In Client Mode mode, the data is loaded into the grid at once. This is the default mode of the grid. The data is loaded into the grid using the dataProvider prop.

Server Mode

In Server Mode mode, the data is loaded in chunks as the user interacts with the grid. This mode is useful when the data is too large to load into the grid at once. The data is loaded into the grid using the serverInfo prop.

The filterPageSortMode prop is used to specify the mode of the grid. The default value is FilterPageSortLoadMode.Client. To enable Server Mode mode, set the value to FilterPageSortLoadMode.Server.

For hierarchical data, there is also the itemLoadMode prop. The default value is FilterPageSortLoadMode.Client. To enable Server Mode mode, set the value to FilterPageSortLoadMode.Server.

We will learn more about these props and how to use them in the next section.