Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
DevExtreme includes four main components for data display and management:

- [DataGrid](/Documentation/Guide/UI_Components/DataGrid/Overview/)
- [TreeList](/Documentation/Guide/UI_Components/TreeList/Overview/)
- [PivotGrid](/Documentation/Guide/UI_Components/PivotGrid/Overview/)
- [CardView](/Documentation/Guide/UI_Components/CardView/Overview/)

Each component connects to similar [data sources](/Documentation/Guide/Data_Binding/Data_Source_Examples/). Selecting the right one depends on the structure of your data and your requirements.
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
Displays tabular data and enables editing. Features include filtering, sorting, grouping, and multiple editing modes.

<img src="/images/DataGrid/data-grid-choose.png" alt="DevExtreme DataGrid" />

Use it for:

- Detailed item lists: orders, customers, transactions
- Tables with multiple editing options, including real-time updates
- Large catalogs with varied data

[note] Use [DataGrid](/Documentation/Guide/UI_Components/DataGrid/Overview/) for flat data or master-detail scenarios that demand advanced table features.
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
Displays hierarchical data in a tree with grid-like features. Suitable for parent-child structures.

<img src="/images/treelist/tree-list-choose.png" alt="DevExtreme TreeList" />

Use it for:

- Organizational charts
- Category hierarchies
- File structures

[note] Use [TreeList](/Documentation/Guide/UI_Components/TreeList/Overview/) for hierarchical (parent-child) structures or when both tree and table formats are needed.
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
Displays and analyzes multidimensional data. Used for OLAP reporting and analytics. Supports custom aggregation and pivoting.

<img src="/images/pivotgrid/pivot-grid-choose.png" alt="DevExtreme PivotGrid" />

Use it for:

- Sales analysis by region, period, or product
- Comparison of financial metrics
- Pivot tables for reports and charts

[note] Use [PivotGrid](/Documentation/Guide/UI_Components/PivotGrid/Overview/) for multidimensional datasets requiring flexible aggregation, analysis, and pivoting.
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
Displays data records as cards. Ideal for visual layouts, adaptive interfaces, and scenarios focused on presentation.

<img src="/images/CardView/card-view-choose.png" alt="DevExtreme CardView" />

Use it for:

- Product directories with images
- Employee or customer lists
- Kanban-style boards for projects or tasks

[note] Use [CardView](/Documentation/Guide/UI_Components/CardView/Overview/) when each item needs a visual format or when responsive, mobile layouts matter.
Binary file added images/CardView/card-view-choose.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/DataGrid/data-grid-choose.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/pivotgrid/pivot-grid-choose.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/treelist/tree-list-choose.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading