Data Browser - Viewing Site  Sector 23 Code Bank Logged in as:  Guest  


Sort/Filter/Export Date column in Angular UI-Grid
If you have a date column in an angular UI-Grid that was serialized from .NET as a string, the default sort/filter/export/display do not work right unless you loop over the set and convert all dates to JS dates, also handling date conversion differences in Chrome vs. IE.
So a better fix is to leave the dates exactly as they were in .NET, and fix the angular grid definition to work with them.

1. In the grid properties (same level as columnDefs) add properties to allow the date fields to be converted to actual dates on export:
(You will need to implement dateHelper.toUIDateString or use a filter to convert your string date to a user-friendly date)
exporterFieldCallback: function (grid, row, col, value) {
if ( === 'LastLogin') {
value = dateHelper.toUIDateString(value);
return value;
2. In your column definition, use the following to tell Angular to filter/sort/display as a date. Key here is the type, filterCellFiltered, and cellFilter:
{ field: 'MyDateColumn', type: 'date', filterCellFiltered: 'true', width: 200, cellTooltip: true, cellFilter: 'date:\'MM/dd/yyyy hh:mm:ss a\'' }

Created By: amos 4/24/2017 10:32:22 AM
Updated: 10/15/2018 6:11:59 AM