DHTMLX Grid - JavaScript DataGrid (DataTable) Widget

Easily extensible JavaScript data grid for processing and managing datasets of any size and type at lightning speed to fit into web applications of any complexity and business realm.

Most Popular in JavaScript DataGrid by DHTMLX

Data operations

Data grouping Starting from v9.0, DHTMLX JavaScript Grid offers powerful data grouping, enabling end-users to organize and analyze large datasets effectively. You can group data by specific columns, aggregate values within groups, and display statistics in the summary rows. Our widget allows full customization of grouping, including columns rendering, order, and data aggregation. Row and column drag-and-drop The drag-and-drop functionality enables end-users to manipulate grid rows and columns comfortably. Users can reorder them inside one grid or between several tables. They can drag and drop multiple rows at once. Developers can disable this feature or adjust it to project requirements via API. Data filtering and multisorting You can determine the ascending or descending sorting order, specify custom sorting rules, and enable multisorting to arrange data by multiple columns at a time. In DHTMLX Grid, you can also add filters in headers, footers, or outside the table, set filtering criteria, and choose filter type: search field, drop-down list, or combobox with autocomplete.

Export module add-ons

Excel and CSV export module Local export module to Excel and CSV ensures the safety of your data. It comes free of charge under the Enterprise and Ultimate licenses. You can purchase it as an add-on with the Individual or Commercial license. It is also possible to export data for free via our online service. PDF/PNG export module You can install the PDF/PNG export module locally to export the grid without hassle. You can buy this module separately in addition to the Individual license. It is shipped free of charge under the Commercial, Enterprise, and Ultimate licenses. You are also eligible to use the online export service.

Simple customization

Row expander The row expander in JS Grid allows users to expand and collapse rows to display additional hierarchical or related data within sub-rows. This feature enhances data management by enabling the integration of nested subgrids, forms, charts, and custom HTML. Sub-rows can be configured dynamically based on specific conditions and highlight corresponding rows. Custom content in cells The DHTMLX JavaScript grid control allows customizing cell content with HTML objects or custom templates. Cell templates make it easy to modify the appearance of cells in an entire column. Thus, your grid can contain anything you need, from icons to checkboxes, for your business aims. Configurable columns The DHTMLX JavaScript data grid API comprises methods and properties to manage table columns. You can hide one or more columns or freeze columns to scroll the table without losing context. The columns’ width, height, and size can be adjusted automatically to fit their content.

JS Grid with Real-Time Updates at Lightning Speed

DHTMLX Grid allows rendering 100,000+ rows in milliseconds. You can show the Chart widget from DHTMLX Suite alongside the grid to visualize data changes and provide quick insights for your end users.

Why Choose a JavaScript DataGrid by DHTMLX

Speedy with massive data

DHTMLX JavaScript Grid control is a full-featured DataGrid library that provides cutting-edge functionality and works incredibly fast with immense data sets. DHTMLX Grid can render 100,000+ rows in milliseconds in real time.

Adjustable to your needs

Due to an extensive JavaScript API, you can configure our HTML5 grid according to your project requirements. You can use it as a simple data table or convert it into a feature-packed versatile UI widget for complex enterprise-grade apps.

Fully customizable look & feel

DHTMLX Grid web control can conform to any design guidelines and behave the way you need. CSS classes and HTML templates allow you to style all elements of the JavaScript datagrid widget. Multiple event handlers help you control how it reacts to user actions.

Excellent fit for any stack

No matter what frameworks you use, you can smoothly combine our JS data grid library with any front-end and back-end technologies. To streamline this process, you can benefit from ready-made code examples with popular frameworks - Angular, React, and Vue.js.

Extensible feature set

Need more than just a grid control for data processing but also built-in Excel-like formulas, multiple worksheets, and automatical aggregations and pivoting? You can extend the DHTMLX Grid with the Spreadsheet and Pivot widgets, coming in a bundle at a reduced cost.