HTML5 JavaScript DataGrid and PivotGrid Enhancements (v17.2)

ASP.NET Team Blog
18 October 2017

The DevExtreme DataGrid and PivotGrid widgets are getting enhancements for you and your end-users. In the v17.2 release we're adding UI features that help you when working with data in our grids:

Built-in Search in Header Filter

The Header Filter is a great way to filter the data in the grid because it gives you all the unique values of the column. However, if there are many distinct values, it can be annoying to scroll through the list trying to find a particular value.

In the next 17.2 release, we've added a search text box that allows to filter data inside the dxDataGrid and dxPivotGrid's header filters. This gif shows the new feature in action:

DevExtreme Grid Header Filter

You can still control whether searching is enabled in the header filter using the dxDataGrid.headerFilter.allowSearch and dxPivotGrid.headerFilter.allowSearch options.

Built-in Search in Column/Field Chooser

We've also added the search functionality to the dxDataGrid's column and dxPivotGrid's field chooser:

DevExtreme Grid Field Chooser

Customize these features through the dxDataGrid.columnChooser.allowSearch and dxPivotGrid.fieldChooser.allowSearch options.

Built-in Date-Time Filter for dxDataGrid

The dxDataGrid’s DateTime columns can be now filtered using the date and time:

DevExtreme Grid Date-Time Filter

Additional minor improvements

  • The validationCallback function now provides access to the current dxDataGrid row data via the data parameter when a Custom validation rule is used  
  • The dxPivotGrid field’s sortBy option can now accept the none value to disable local sorting

Angular, ASP.NET MVC/Core, & More!

Note that all these new features are available in the DataGrid and PivotGrid Angular components, ASP.NET MVC and .NET Core controls, and jQuery widgets too.

Try it now

The new features of our dxDataGrid and dxPivotGrid widgets are included in the v17.2 pre-release that is available via npm right now. Please note that this pre-release may contain some bugs and is not intended to be used in production:

npm install devextreme@17.2.1-pre-17273

Learn more about DevExtreme's pre-releases in this blog post.

What do you think about the grid improvements in the next release? Drop me a line below.


Twitter: @mehulharry

Free DevExpress Products - Get Your Copy Today

The following free DevExpress product offers remain available. Should you have any questions about the free offers below, please submit a ticket via the DevExpress Support Center at your convenience. We'll be happy to follow-up.
No Comments

Please login or register to post comments.