0

I have two date columns in Angular SlickGrid, the column values of the table is based on a class. These two columns are based on two date fields of this class.

I want to display these values as dateTimeShortIso, but use the dateRange filter for each of these two columns.

For some reason, when actually using the filter, no data shows up

Here is the relevant part of the class

export class Task {
  public createdDate: Date;
  public dateUpdated: Date;
}

Here is how I populate the dataset

this._api
      .getApiData()
      .subscribe((res: Task) => {
        this.dataset = res;
      });

Here are the relevant column definitions.

this.columnDefinitions = [
      {
        id: 'createdDate', name: 'Created Date', field: 'createdDate', sortable: true, filterable: true, 
        formatter: Formatters.dateTimeShortIso, type: FieldType.date, filter: {
          model: Filters.dateRange
        }
      },
      {
        id: 'dateUpdated', name: 'Date Updated', field: 'dateUpdated', sortable: true, filterable: true, 
        formatter: Formatters.dateIso, type: FieldType.date, filter: {
          model: Filters.dateRange
        }
      }
    ];
  • I think you'll need also the `outputType` property for the picker to use correct format, `type: FieldType.dateUtc, outputType: FieldType.dateTimeIso`. Anyway there's not enough info in your question to help you more than that, the Example I did works as intended so... – ghiscoding Jun 17 '20 at 14:19
  • I have updated the question, I hope that's enough. I have used the example you did exactly as it is, but I don't know what's going on here. – Johannes Karsten Jun 18 '20 at 06:30
  • Found the problem, it's where I populate the dataset, I had to reinitiate the dates for these columns, example: createdDate = new Date(createdDate); – Johannes Karsten Jun 18 '20 at 08:02

1 Answers1

0

The date format might not be correct. Use the date constructor to 'reinitiate' the dates, example:

createdDate = new Date(createdDate);