All Demos / Kanban / Data Binding / Remote Data

Blazor Kanban Board - Remote Data Binding

Loading Syncfusion Blazor Server Demos…
This demo passes automated axe checks with 0 violations — semantic markup, ARIA, full keyboard operation, visible focus. Section 508 conformant Accessibility report VPAT

This sample demonstrates binding remote data to the Blazor Kanban component using the DataManager by visualizing a software development task tracker. The board fetches bug reports and feature requests from a remote endpoint and groups them by workflow status.

Assign an instance of DataManager to the Kanban DataSource to enable remote data binding. The DataManager acts as an interface between the service endpoint and the Kanban component and requires the following minimal configuration:

  • DataManager.Url – Defines the endpoint to fetch data.
  • DataManager.Adaptor – Specifies the adaptor. By default, ODataAdaptor is used. The adaptor processes requests/responses. The Syncfusion.Blazor.Data package includes adaptors like:
    • UrlAdaptor – Interact with generic remote services.
    • ODataAdaptor – For OData endpoints.
    • ODataV4Adaptor – For OData V4 endpoints.
    • WebApiAdaptor – For Web API endpoints under OData standards.
    • WebMethodAdaptor – For web methods.

Additional essential interactions that enhance analysis and control are also featured:

  • Columns: Group cards by workflow stage such as To Do, In Progress, Testing, and Done.
  • Data Binding: Fetch cards on demand from a remote endpoint using a configured SfDataManager.
  • Dialog Cancel: The default card dialog is suppressed so the board behaves as a read-only tracker.

Key interactive features demonstrated in this sample include:

  • Remote Data Binding: Cards are fetched from a remote service through SfDataManager using the WebApiAdaptor.
  • Cross Domain Support: The CrossDomain flag on SfDataManager enables requests to the hosted demo endpoint.
  • Disabled Drag and Drop: Drag and drop is disabled in this demo so the remote state is not mutated from the client.
  • Read-only Board: The default edit dialog is cancelled via the DialogOpen event to keep the board display-only.

The Data Binding panel highlights the supported ways to populate the board from a remote source:

  • SfDataManager: A SfDataManager is assigned directly to the Kanban DataSource property to wire up remote data.
  • Adaptor Selection: The WebApiAdaptor is used to communicate with the Web API endpoint exposed by Syncfusion.
  • Column Mapping: The KeyField on each column maps to the Status field returned by the remote service.

Looking for the full Blazor Kanban component overview, features, pricing, and documentation? Visit the Blazor Kanban page.