Blazor DataGrid Example - Flexible Data Binding
This sample demonstrates how to bind data from various remote services to the Blazor DataGrid component.
Order ID | Customer ID | Freight | Ship City |
|---|
| No records to display |
Properties
Service
:
|
Payload Information
Service URL : https://blazor.syncfusion.com/services/development/odata/gridodatav4service
Adaptor Type : ODataV4Adaptor
The Blazor DataGrid supports flexible data binding using an instance of SfDataManager, which connects to remote data.
The SfDataManager, which acts as an interface between the service endpoint and the Blazor DataGrid, requires the following information to interact with the service endpoint properly:
SfDataManager->Url: Specifies the service endpoint for fetching data.SfDataManager->Adaptor: Defines the adaptor type.
The adaptor is responsible for processing requests and responses between the service endpoint and the Blazor DataGrid. The Syncfusion.Blazor.Data package provides several predefined adaptors designed to interact with specific service endpoints, including:
- UrlAdaptor: To interact with any remote service. This is the base adaptor for all remote adaptors.
- ODataV4Adaptor: To interact with OData V4 endpoints.
- WebApiAdaptor: To interact with Web APIs created under OData standards.
ODataV4Adaptor is used in this demo. The adaptor type is automatically assigned based on the selected data service.
The datasource of the Blazor DataGrid can be dynamically changed by following these steps:
- Select any URL from the Service dropdown to update the data source in the Grid.
- In this demo, we have used ODataV4Service, but you can modify it as needed.
- Paging is enabled by default. To disable it, uncheck the Paging option. When paging is disabled, Virtualization feature is enabled for smooth data rendering.
- The connected service will be listed under Payload Information, along with the respective adaptor.
More information on data binding can be found in the documentation.