React Data Grid
jQWidgets Data Grid for React is a professional datagrid component built with React, Typescript and the jQWidgets framework. It offers hundreds of features like
sorting, filtering, grouping, master-detail views, paging and more. It also ships with many advanced capabilities like
drag and drop, columns resize, printing, data export, aggregates, RTL support and more. The React data grid is a perfect solution for enterprise applications built with the React UI framework.
The jQWidgets React Data Grid component offers top performance and responsive, fluid design. It offers easy to use and well documented APIs. The jQWidgets framework ships with over ready to use 1000 React examples. Like all widgets in the jQWidgets
framework the React Grid component works across a range of devices and offers responsive, device-optimized look and behavior on PCs, tablets and mobile phones.
jQWidgets Grid for React is trusted by thousands of companies and big user community. We offer excellent techinical support and customization services. The jQWidgets framework releases frquent updates with continuous improvements.
Data Binding in React Grid
The grid component has built-in data binding capabilities and supports client and server-side paging. It can be bound to Local Data, JSON, XML, CSV, TSV, Remote Data (JSONP)
and Virtual Data. In order to databind the Data Grid to a data source you need to set its source property to point to an instance of jqxDataAdapter.
Sorting and filtering in React Grid
React applications using the data grid component can benefit from advanced filtering (including custom filters), and sorting capabilities.
The grid sorting is customizable and can be enabled or disabled. The data in the grid can be sorted from the UI by clicking on a column or using a context menu button, as well as programmatically via the APIs of the React grid. The default behavior of the sorting function is to apply ascending or descending sort depending values in each column. The grid's API also allow developers to extend and customize the sorting with custom sort and compare functions.
The filtering in the React grid component is extremely flexible. The grid offers standard filters with context menus and selection of filtering operators and conditions. The developer may also choose to use a filter row which will appear at the top of the grid's rows. Users may enter data in each column and the filtration will be done by matching the corresponding records in the grid. The filter menus are fully customizable.
The React grid also provides Excel-style filters with checkbox selection of the items in each grid column.
Columns and cells formatting in React Grid
The DataGrid offers many options for columns and cells formatting. You can align the text in the cells left, right or center and have different bacckround colors. The
columns can be shown or hidden and can be auto-sized. You can also have checkboxes, images and other widgets in the columns. In addition jQWidgets Grid for React
enables complex features like column tooltips, foreign key, computed and pinned columns. You can also do reordering and resizing of the columns.
Advanced Features in React Grid
For the React applications requiring complex features, jqxGrid offers drag and drop (including dragging multiple rows), row details, custom keyboard navigation,
deferred scrolling on large data sets, nested grids, master-details grids, toolbars on the grid, status bar, right to left support and more.
Export and printing
The Grid component offers export to Excel, PDF, XML, HTML, CSV, TSV and JSON. It also offers data printing.
