Server Data Persistence in React Data Grid
5 Sep 20262 minutes to read
The Data Grid component allows data edited within the grid to be persisted in a database using RESTful web services. All CRUD (Create, Read, Update, Delete) operations within the grid are handled by the DataManager, which can bind server-side data and send updates to the server. This capability is Essential® for maintaining data integrity and ensuring that changes made in the UI are reflected in the backend.
Syncfusion® provides multiple adaptors to handle different server protocols and APIs, enabling smooth integration with RESTful services. Below are the various adaptors you can use to persist data in the React Data Grid component.
For your information, the ODataAdaptor persists data in the server as per OData protocol.
URL adaptor
The UrlAdaptor is the base adaptor that facilitates communication between remote data services and the UI component. It allows seamless data binding and interaction with custom API services or any remote service through URLs. The UrlAdaptor is particularly useful when a custom API service has unique logic for handling data and CRUD operations.
- For configuration details and examples, refer to the URL adaptor Documentation.
- For CRUD examples, see UrlAdaptor CRUD operations.
Remote Save adaptor
The RemoteSaveAdaptor in the Data Grid component allows grid actions such as sorting, filtering, searching, and paging to be performed primarily on the client side, while handling CRUD operations (updating, inserting, and removing data) on the server side for data persistence. This approach optimizes performance by minimizing unnecessary server interactions.
For further details on configuration, refer to the Remote Save Adaptor Documentation
OData V4 adaptor
The ODataV4Adaptor in the Data Grid Component facilitates seamless integration with OData V4 services, allowing for efficient data fetching and manipulation. CRUD operations can be performed using the ODataV4Adaptor in the React Data Grid component.
- For configuration details and examples, refer to the OData V4 Adaptor Documentation.
- For CRUD examples, see OData V4 Adaptor CRUD operations.
Web API adaptor
The WebApiAdaptor extends the capabilities of the ODataAdaptor and is designed to interact with Web APIs created with OData endpoints. This adaptor ensures seamless communication between the React Data Grid and OData-based Web APIs, enabling efficient data retrieval and manipulation.
- For configuration details and examples, refer to the Web API Adaptor documentation.
- For CRUD examples, see Web API Adaptor CRUD operations.
GraphQL adaptor
The GraphQLAdaptor enables the Data Grid to communicate with GraphQL services and perform CRUD operations through GraphQL queries and mutations. It supports efficient data retrieval by allowing applications to request only the required data from the server.
Refer to the GraphQL Adaptor documentation for setup details, advanced features, and examples.
Web Method adaptor
The WebMethodAdaptor facilitates data binding from remote services using web methods. This adaptor sends query parameters encapsulated within an object named value, allowing efficient communication between the client-side application and the server.
- For configuration, refer to Web Method Adaptor documentation.
- For CRUD examples, see Web API Adaptor CRUD operations.