sortField is overriding filterField value and breaking filtering

[devakone]

Hello thanks for this nice library! Very powerful and flexible. I am using 8.1.4 and ran into a weird issue mixing sortField and filterField.

Here is my data shape

[
  {
    totalCount: '18',
    assertionID: '1733',
    claimStatus: 'fail',
    finalPolicy: 'obligation',
    riskLevelValue: 4,
    riskLevel:'High',
    id: null
  }
]

Here my column definition for the Risk Level column, which should use riskLevel for display but riskLevelValue for sorting since the numeric value is what matters for the sorting.

 <ng-data-table-column
      [field]="'riskLevel'"
      [title]="'Risk Level'"
      [filterable]="true"
      [sortable]="true"
      [width]="100"
      [showDropdownFilter]="true"
      [dropdownFilterSearchable]="false"
      [dropdownFilterMenuWidth]="100"
      [dropdownFilterDynamicDimensionCalculation]="true"
      [dropdownFilterDynamicWidthRatio]="1"
      [dropdownFilterDynamicHeightRatio]="0.7"
      [sortField]="'riskLevelValue'"
      [filterField]="'riskLevel'"
      [filterExpression]="riskLevelFilterHandler"
    >

As you can see both field and filterField are set to the riskLevel property, which is right, and sortField is set to the riskLevelValue.

With things set up this way, sorting works absolutely, but filtering is broken. I did some debugging, that's why you see the filterExpression being set and found out that, as soon as [sortField]="'riskLevelValue'" is set, the field sent at the second parameter to the filterExpression is always set to riskLevelValue, even though the other field values are set. Is this a case of working as designed or is there an actual bug there?

Thank you

[arunmeanssun]

Hi Ornamentum Team,

This is a wonderful plugin, with lot of features pre installed. I am also having the same issue, as mentioned by @devakone .

I have a date field which is being sorted with the help of sortField attribute with another calculated unix time epoch value of the date. Sorting was successful, but filter was not working properly. If i remove the sortField attribute, the filter works fine.

Then I checked the document for filters and then found out this attribute "filterField". I tried giving the field exactly as the "field" attribute to override "sortField" value and it's functionality. But not working as expected and "filterField" value is not being considered.

Any solution would be appreciated for this issue. .. for the "filterField" attribute to work.

[devakone]

Hi @arunmeanssun . This is how i solved it for my own case which was a string, not a date, so keep that in mind.

component.html

...
 [field]="'riskLevel'"
 [sortField]="'riskLevelID'"
 [filterField]="'riskLevel'"
 [filterExpression]="riskLevelFilterHandler">

then in component.ts

...
 riskLevelFilterHandler(item: any, field: string, filterValue: any) {
    if (filterValue && filterValue.length && !filterValue.includes(item['riskLevel'])) {
      return false;
    }
    return true;
  }
...

So basically you have to

1. Use different properties for sortField and filterField
2. Use the filterExpression function callback to handle the filtering on your own. Understand tht the filterValue sent in the callback is whatever value you set as sortField.

This is what you have to do if you want to mix sortField and filterField until this bug is fixed.

[arunmeanssun]

Thank you @devakone , It's working for me even with the date field. We have date as a string and then time as also string. we internaly process to generate unix time for sorting purpose.

Now the filter is also working along with sort feature with filter expression handler, mentioning the column name ("date") in the if condition like below.

riskLevelFilterHandler(item: any, field: string, filterValue: any) { if (filterValue && filterValue.length && !filterValue.includes(item['date'])) { return false; } return true; }

Thanks a lot, @devakone for the filterHandler function...