HTML5 JavaScript DataGrid and PivotGrid Enhancements (v17.2)

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.

Email: mharry@devexpress.com

Twitter: @mehulharry

8 comment(s)
Leontiev Alexey

Good!

I want to have the feature to see the selected filter conditions in the information panel.

17 October, 2017
Mo cisse

Good Job Mehul.

17 October, 2017
Mehul Harry (DevExpress)

@Andrey, thanks for the feedback.

@Siddhartha, thanks for your support.

17 October, 2017
Alexander Vousvounis

Maybe it's time for a material design theme...

18 October, 2017
Maneesh kumar 1

Thanks to consider search operation in your per-release . Please let me know when you are releasing this version.

9 November, 2017
Mehul Harry (DevExpress)

@Maneesh,

Download our v17.2 beta that's available now for existing customers and you can test out any of the features mentioned above. The final release will likely be in the next few weeks.

10 November, 2017
Arlei F. Farnetani Jr.

We have seen there the huge growth of the Vuejs framework, when do you think of porting this datagrid of yours to vuejs?

20 November, 2017
Mehul Harry (DevExpress)

@Arlei,

We've seen some customer requests for VueJS and while we don't support it now, we are investigating this framework.

Thanks,

20 November, 2017

Please login or register to post comments.