React Grid

We've focused our energy on performance and leveraged best practice recommendations from the React team. Through immutability and pure functions, we apply ‘memoization’ and built-in React optimizations to achieve outstanding React Grid performance.

Virtual scrolling allows our React Grid component to display thousands of records on a single page. DevExtreme React Grid can render only those records visible to users and remove them from the DOM once the user scrolls past the visible range.

Allow a user to sort data within the Grid against multiple columns. You can apply and remove sort order column using the command keys on your keyboard. You can also execute sort operations on the server-side.

Data grouping is a highly effective way to summarize/organize information for end-users. You can enable grouping against one or more columns programmatically or allow your end-users to group data via the mouse, keyboard or through touch gestures on mobile devices.

Easily turn your data Grid into an analytics tool with our built-in data aggregation features. Implemented as a Summary Row plugin, our Grid can calculate sums, averages, minimums, maximums and custom summary values for both separate groups and the entire data set.

Intuitive column-based search. With our Filter Row plugin, users can filter the contents of the React Grid by individual column values. Based on the data type associated with a column, you can control the search operators used (Contains, Equals, etc).

A simple and quick way to locate records. The Search Panel plugin removes all complexities associated with data filtering. Once enabled, the Search Panel allows users to enter a search string and initiate a search against all values displayed in the grid.

The Tree View plugin allows you to display hierarchical data sets within the React Grid. Our Tree View plugin integrates with other Grid plugins.

Extend each Grid data row with a collapsible detail view. This feature allows you to address a variety of business usage scenarios from Master-Detail collection management to in-place record-related data editing and visualization.

From a read-only to a fully editable React Grid with a couple lines of code. Our React Grid ships with integrated data editing plugins. As a developer, you have full control over the data editing process via its straightforward API.

Our React Grid ships with a Data Type Provider plugin that allows you to display custom in-place cell editors (based upon data type). Use what you need in your app - from standard textboxes, to date pickers and everything in between.

Batch modifications allow you to apply multiple record changes simultaneously and to improve data entry efficiency. When working with remote data, batch modifications can also help eliminate unnecessary remote data update requests.

End-users can select data via a row click/tap or by using the grid’s built-in checkbox selection column. You can activate our 'Select All' checkbox and configure it to select records on the current page or all records linked to the grid.

End-users can resize and reorder columns as needed. Use our 'controlled state' mode to expose the current customization state to your application logic for persistence. Save and restore it when a user leaves and/or returns to your app.

Our React Grid ships with an integrated column chooser UI. With it, users can display/hide desired grid columns at runtime. You can specify the set of visible columns and save/restore customizations made by end-users to the browser’s local storage or into a remote database.

Fixed Columns allow you to anchor columns to the left or rightmost edge of the Grid. These fixed columns are never scrolled horizontally and as such, allow you to create solutions that offer improved readability and visual clarity.

Improve usability/readability by grouping your column headers into bands. Multi-level column groups are supported via a corresponding plugin.

We done everything possible to simplify UI and behavior customization. With our React Grid, you can override, modify or extend built-in functionality to fully address business needs.