DxDataGrid<T> Class

A Data Grid component.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v21.2.dll

Declaration

public class DxDataGrid<T> :
    DxControlComponent<DxDataGrid<T>, GridJSInteropProxy>,
    IDataSourceSettings<T>,
    IDataGridComponentServiceContainer,
    ISizeModeAccessor,
    IRequireSelfCascading,
    IGridJSInteropProxyServer,
    IJSCallback,
    IObserver<IEnumerable<IColumnModel<T>>>

Type Parameters

Name Description
T

The data item type.

Remarks

<DxDataGrid> allows you to edit and shape data in a tabular format.

DataGrid Overview

Run Demo: Data Grid - Overview

Add a Data Grid to a Project

Follow the steps below to add the Data Grid component to an application:

  1. Use a DevExpress Project Template to create a new Blazor Server or Blazor WebAssembly application. If you use a Microsoft project template or already have a Blazor project, configure your project to incorporate DevExpress Blazor components.
  2. Add the <DxDataGrid></DxDataGrid> markup to a Razor page.
  3. Bind the Data Grid to a strongly-typed data collection.
  4. Add columns to the Data Grid’s markup.
  5. Specify other Data Grid options (see the feature list below).

Read Tutorial: Get Started with Data Grid Watch Video: Get Started with Data Grid

Features / Online Demos

If you are new to the Data Grid, we recommend that you first review this component’s online demos. Each demo module shows a live component where you can try the feature. You can also find descriptions and links to related API members.

The following list includes all available demo modules and a few additional features. These extra features do not require separate demo modules.

Data Binding

Columns

Edit Data

Shape Data

Rows

Paging and Scrolling

Hierarchy

Appearance

Tools

State

Inheritance

Object
ComponentBase
DevExpress.Blazor.Base.DxAsyncDisposableComponent
DevExpress.Blazor.Base.DxDecoratedComponent
DxComponentBase
DxComponentBase<DevExpress.Blazor.Internal.JSInterop.GridJSInteropProxy>
DxControlComponent<DxDataGrid<T>, DevExpress.Blazor.Internal.JSInterop.GridJSInteropProxy>
DxDataGrid<T>
See Also