diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/booleanFilterCondition.ts b/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/booleanFilterCondition.ts index 90e0cb895..7c2c348a2 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/booleanFilterCondition.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/booleanFilterCondition.ts @@ -5,5 +5,6 @@ function parseBoolean(input: boolean | number | string) { } export const booleanFilterCondition: FilterCondition = (options: FilterConditionOption) => { - return parseBoolean(options.cellValue) === parseBoolean(options.searchTerm || false); + const searchTerm = Array.isArray(options.searchTerms) && options.searchTerms[0] || ''; + return parseBoolean(options.cellValue) === parseBoolean(searchTerm); }; diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/dateFilterCondition.ts b/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/dateFilterCondition.ts index b390b9e97..af979af3e 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/dateFilterCondition.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/dateFilterCondition.ts @@ -4,13 +4,14 @@ import { testFilterCondition } from './filterUtilities'; import * as moment from 'moment'; export const dateFilterCondition: FilterCondition = (options: FilterConditionOption) => { + const searchTerm = Array.isArray(options.searchTerms) && options.searchTerms[0] || ''; const filterSearchType = options.filterSearchType || FieldType.dateIso; const searchDateFormat = mapMomentDateFormatWithFieldType(filterSearchType); - if (!moment(options.cellValue, moment.ISO_8601).isValid() || !moment(options.searchTerm, searchDateFormat, true).isValid()) { + if (searchTerm === null || searchTerm === '' || !moment(options.cellValue, moment.ISO_8601).isValid() || !moment(searchTerm, searchDateFormat, true).isValid()) { return false; } const dateCell = moment(options.cellValue); - const dateSearch = moment(options.searchTerm); + const dateSearch = moment(searchTerm); // run the filter condition with date in Unix Timestamp format return testFilterCondition(options.operator || '==', parseInt(dateCell.format('X'), 10), parseInt(dateSearch.format('X'), 10)); diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/dateIsoFilterCondition.ts b/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/dateIsoFilterCondition.ts index 0f3843843..1fbb61d0e 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/dateIsoFilterCondition.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/dateIsoFilterCondition.ts @@ -5,11 +5,12 @@ import * as moment from 'moment'; const FORMAT = mapMomentDateFormatWithFieldType(FieldType.dateIso); export const dateIsoFilterCondition: FilterCondition = (options: FilterConditionOption) => { - if (!moment(options.cellValue, FORMAT, true).isValid() || !moment(options.searchTerm, FORMAT, true).isValid()) { + const searchTerm = Array.isArray(options.searchTerms) && options.searchTerms[0] || ''; + if (searchTerm === null || searchTerm === '' || !moment(options.cellValue, FORMAT, true).isValid() || !moment(searchTerm, FORMAT, true).isValid()) { return false; } const dateCell = moment(options.cellValue, FORMAT, true); - const dateSearch = moment(options.searchTerm, FORMAT, true); + const dateSearch = moment(searchTerm, FORMAT, true); // run the filter condition with date in Unix Timestamp format return testFilterCondition(options.operator || '==', parseInt(dateCell.format('X'), 10), parseInt(dateSearch.format('X'), 10)); diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/dateUsFilterCondition.ts b/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/dateUsFilterCondition.ts index 3b2f238ef..955a26be5 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/dateUsFilterCondition.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/dateUsFilterCondition.ts @@ -5,11 +5,12 @@ import * as moment from 'moment'; const FORMAT = mapMomentDateFormatWithFieldType(FieldType.dateUs); export const dateUsFilterCondition: FilterCondition = (options: FilterConditionOption) => { - if (!moment(options.cellValue, FORMAT, true).isValid() || !moment(options.searchTerm, FORMAT, true).isValid()) { + const searchTerm = Array.isArray(options.searchTerms) && options.searchTerms[0] || ''; + if (searchTerm === null || searchTerm === '' || !moment(options.cellValue, FORMAT, true).isValid() || !moment(searchTerm, FORMAT, true).isValid()) { return false; } const dateCell = moment(options.cellValue, FORMAT, true); - const dateSearch = moment(options.searchTerm, FORMAT, true); + const dateSearch = moment(searchTerm, FORMAT, true); // run the filter condition with date in Unix Timestamp format return testFilterCondition(options.operator || '==', parseInt(dateCell.format('X'), 10), parseInt(dateSearch.format('X'), 10)); diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/dateUsShortFilterCondition.ts b/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/dateUsShortFilterCondition.ts index 82a8f02be..9cd44844d 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/dateUsShortFilterCondition.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/dateUsShortFilterCondition.ts @@ -5,11 +5,12 @@ import { mapMomentDateFormatWithFieldType } from './../services/utilities'; const FORMAT = mapMomentDateFormatWithFieldType(FieldType.dateUsShort); export const dateUsShortFilterCondition: FilterCondition = (options: FilterConditionOption) => { - if (!moment(options.cellValue, FORMAT, true).isValid() || !moment(options.searchTerm, FORMAT, true).isValid()) { + const searchTerm = Array.isArray(options.searchTerms) && options.searchTerms[0] || ''; + if (searchTerm === null || searchTerm === '' || !moment(options.cellValue, FORMAT, true).isValid() || !moment(searchTerm, FORMAT, true).isValid()) { return false; } const dateCell = moment(options.cellValue, FORMAT, true); - const dateSearch = moment(options.searchTerm, FORMAT, true); + const dateSearch = moment(searchTerm, FORMAT, true); // run the filter condition with date in Unix Timestamp format return testFilterCondition(options.operator || '==', parseInt(dateCell.format('X'), 10), parseInt(dateSearch.format('X'), 10)); diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/dateUtcFilterCondition.ts b/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/dateUtcFilterCondition.ts index c54fa8b7e..7c6bde21d 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/dateUtcFilterCondition.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/dateUtcFilterCondition.ts @@ -4,12 +4,13 @@ import { testFilterCondition } from './filterUtilities'; import * as moment from 'moment'; export const dateUtcFilterCondition: FilterCondition = (options: FilterConditionOption) => { + const searchTerm = Array.isArray(options.searchTerms) && options.searchTerms[0] || ''; const searchDateFormat = mapMomentDateFormatWithFieldType(options.filterSearchType || options.fieldType); - if (!moment(options.cellValue, moment.ISO_8601).isValid() || !moment(options.searchTerm, searchDateFormat, true).isValid()) { + if (searchTerm === null || searchTerm === '' || !moment(options.cellValue, moment.ISO_8601).isValid() || !moment(searchTerm, searchDateFormat, true).isValid()) { return false; } const dateCell = moment(options.cellValue, moment.ISO_8601, true); - const dateSearch = moment(options.searchTerm, searchDateFormat, true); + const dateSearch = moment(searchTerm, searchDateFormat, true); // run the filter condition with date in Unix Timestamp format return testFilterCondition(options.operator || '==', parseInt(dateCell.format('X'), 10), parseInt(dateSearch.format('X'), 10)); diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/numberFilterCondition.ts b/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/numberFilterCondition.ts index 110c79d9a..2a1c03410 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/numberFilterCondition.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/numberFilterCondition.ts @@ -3,7 +3,10 @@ import { testFilterCondition } from './filterUtilities'; export const numberFilterCondition: FilterCondition = (options: FilterConditionOption) => { const cellValue = parseFloat(options.cellValue); - const searchTerm = (typeof options.searchTerm === 'string') ? parseFloat(options.searchTerm) : options.searchTerm; + let searchTerm = (Array.isArray(options.searchTerms) && options.searchTerms[0]) || 0; + if (typeof searchTerm === 'string') { + searchTerm = parseFloat(searchTerm); + } return testFilterCondition(options.operator || '==', cellValue, searchTerm); }; diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/stringFilterCondition.ts b/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/stringFilterCondition.ts index 7b8a3a09b..cf3b7ed71 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/stringFilterCondition.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/filter-conditions/stringFilterCondition.ts @@ -7,7 +7,10 @@ export const stringFilterCondition: FilterCondition = (options: FilterConditionO // make both the cell value and search value lower for case insensitive comparison const cellValue = options.cellValue.toLowerCase(); - const searchTerm = (typeof options.searchTerm === 'string') ? options.searchTerm.toLowerCase() : options.searchTerm; + let searchTerm = (Array.isArray(options.searchTerms) && options.searchTerms[0]) || ''; + if (typeof searchTerm === 'string') { + searchTerm = searchTerm.toLowerCase(); + } if (options.operator === '*' || options.operator === OperatorType.endsWith) { return cellValue.endsWith(searchTerm); diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/filters/compoundDateFilter.ts b/aurelia-slickgrid/src/aurelia-slickgrid/filters/compoundDateFilter.ts index 3d924c56a..7eeda2d8c 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/filters/compoundDateFilter.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/filters/compoundDateFilter.ts @@ -24,15 +24,19 @@ export class CompoundDateFilter implements Filter { private _currentValue: string; flatInstance: any; grid: any; - gridOptions: GridOption; operator: OperatorType | OperatorString | undefined; - searchTerm: SearchTerm | undefined; + searchTerms: SearchTerm[]; columnDef: Column; callback: FilterCallback; filterType = FilterType.compoundDate; constructor(private i18n: I18N) { } + /** Getter for the Grid Options pulled through the Grid Object */ + private get gridOptions(): GridOption { + return (this.grid && this.grid.getOptions) ? this.grid.getOptions() : {}; + } + /** * Initialize the Filter */ @@ -42,14 +46,14 @@ export class CompoundDateFilter implements Filter { this.callback = args.callback; this.columnDef = args.columnDef; this.operator = args.operator || ''; - this.searchTerm = args.searchTerm; - if (this.grid && typeof this.grid.getOptions === 'function') { - this.gridOptions = this.grid.getOptions(); - } + this.searchTerms = args.searchTerms || []; + + // date input can only have 1 search term, so we will use the 1st array index if it exist + const searchTerm = (Array.isArray(this.searchTerms) && this.searchTerms[0]) || ''; // step 1, create the DOM Element of the filter which contain the compound Operator+Input // and initialize it if searchTerm is filled - this.$filterElm = this.createDomElement(); + this.$filterElm = this.createDomElement(searchTerm); // step 3, subscribe to the keyup event and run the callback when that happens // also add/remove "filled" class for styling purposes @@ -84,9 +88,9 @@ export class CompoundDateFilter implements Filter { /** * Set value(s) on the DOM element */ - setValues(values: SearchTerm) { - if (values) { - this.flatInstance.setDate(values); + setValues(values: SearchTerm[]) { + if (values && Array.isArray(values)) { + this.flatInstance.setDate(values[0]); } } @@ -94,7 +98,7 @@ export class CompoundDateFilter implements Filter { // private functions // ------------------ - private buildDatePickerInput(searchTerm: SearchTerm) { + private buildDatePickerInput(searchTerm?: SearchTerm) { const inputFormat = mapFlatpickrDateFormatWithFieldType(this.columnDef.type || FieldType.dateIso); const outputFormat = mapFlatpickrDateFormatWithFieldType(this.columnDef.outputType || this.columnDef.type || FieldType.dateUtc); let currentLocale = this.i18n.getLocale() || 'en'; @@ -159,15 +163,10 @@ export class CompoundDateFilter implements Filter { /** * Create the DOM element */ - private createDomElement() { + private createDomElement(searchTerm?: SearchTerm) { const $headerElm = this.grid.getHeaderRowColumn(this.columnDef.id); $($headerElm).empty(); - const searchTerm = (this.searchTerm || '') as string; - if (searchTerm) { - this._currentValue = searchTerm; - } - // create the DOM Select dropdown for the Operator this.$selectOperatorElm = $(this.buildSelectOperatorHtmlString()); this.$filterInputElm = this.buildDatePickerInput(searchTerm); @@ -199,8 +198,9 @@ export class CompoundDateFilter implements Filter { } // if there's a search term, we will add the "filled" class for styling purposes - if (this.searchTerm) { + if (searchTerm) { $filterContainerElm.addClass('filled'); + this._currentValue = searchTerm as string; } // append the new DOM element to the header row @@ -223,7 +223,7 @@ export class CompoundDateFilter implements Filter { private onTriggerEvent(e: Event | undefined) { const selectedOperator = this.$selectOperatorElm.find('option:selected').text(); (this._currentValue) ? this.$filterElm.addClass('filled') : this.$filterElm.removeClass('filled'); - this.callback(e, { columnDef: this.columnDef, searchTerm: this._currentValue, operator: selectedOperator || '=' }); + this.callback(e, { columnDef: this.columnDef, searchTerms: [this._currentValue], operator: selectedOperator || '=' }); } private hide() { diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/filters/compoundInputFilter.ts b/aurelia-slickgrid/src/aurelia-slickgrid/filters/compoundInputFilter.ts index 093c13808..1cc8b4704 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/filters/compoundInputFilter.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/filters/compoundInputFilter.ts @@ -23,15 +23,19 @@ export class CompoundInputFilter implements Filter { private $filterInputElm: any; private $selectOperatorElm: any; grid: any; - gridOptions: GridOption; operator: OperatorType | OperatorString | undefined; - searchTerm: SearchTerm | undefined; + searchTerms: SearchTerm[]; columnDef: Column; callback: FilterCallback; filterType = FilterType.compoundInput; constructor(private i18n: I18N) { } + /** Getter for the Grid Options pulled through the Grid Object */ + private get gridOptions(): GridOption { + return (this.grid && this.grid.getOptions) ? this.grid.getOptions() : {}; + } + /** * Initialize the Filter */ @@ -41,14 +45,14 @@ export class CompoundInputFilter implements Filter { this.callback = args.callback; this.columnDef = args.columnDef; this.operator = args.operator || ''; - this.searchTerm = args.searchTerm; - if (this.grid && typeof this.grid.getOptions === 'function') { - this.gridOptions = this.grid.getOptions(); - } + this.searchTerms = args.searchTerms || []; + + // filter input can only have 1 search term, so we will use the 1st array index if it exist + const searchTerm = (Array.isArray(this.searchTerms) && this.searchTerms[0]) || ''; // step 1, create the DOM Element of the filter which contain the compound Operator+Input // and initialize it if searchTerm is filled - this.$filterElm = this.createDomElement(); + this.$filterElm = this.createDomElement(searchTerm); // step 3, subscribe to the keyup event and run the callback when that happens // also add/remove "filled" class for styling purposes @@ -86,9 +90,9 @@ export class CompoundInputFilter implements Filter { /** * Set value(s) on the DOM element */ - setValues(values: SearchTerm) { - if (values) { - this.$filterElm.val(values); + setValues(values: SearchTerm[]) { + if (values && Array.isArray(values)) { + this.$filterElm.val(values[0]); } } @@ -146,7 +150,7 @@ export class CompoundInputFilter implements Filter { /** * Create the DOM element */ - private createDomElement() { + private createDomElement(searchTerm?: SearchTerm) { const $headerElm = this.grid.getHeaderRowColumn(this.columnDef.id); $($headerElm).empty(); @@ -173,7 +177,6 @@ export class CompoundInputFilter implements Filter { $filterContainerElm.append($containerInputGroup); $filterContainerElm.attr('id', `filter-${this.columnDef.id}`); - const searchTerm = (typeof this.searchTerm === 'boolean') ? `${this.searchTerm}` : this.searchTerm; this.$filterInputElm.val(searchTerm); this.$filterInputElm.data('columnId', this.columnDef.id); @@ -182,7 +185,7 @@ export class CompoundInputFilter implements Filter { } // if there's a search term, we will add the "filled" class for styling purposes - if (this.searchTerm) { + if (searchTerm) { $filterContainerElm.addClass('filled'); } @@ -198,6 +201,6 @@ export class CompoundInputFilter implements Filter { const selectedOperator = this.$selectOperatorElm.find('option:selected').text(); const value = this.$filterInputElm.val(); (value) ? this.$filterElm.addClass('filled') : this.$filterElm.removeClass('filled'); - this.callback(e, { columnDef: this.columnDef, searchTerm: value, operator: selectedOperator || '' }); + this.callback(e, { columnDef: this.columnDef, searchTerms: [value], operator: selectedOperator || '' }); } } diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/filters/inputFilter.ts b/aurelia-slickgrid/src/aurelia-slickgrid/filters/inputFilter.ts index de08f5b4f..6b9901691 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/filters/inputFilter.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/filters/inputFilter.ts @@ -12,12 +12,16 @@ import * as $ from 'jquery'; export class InputFilter implements Filter { private $filterElm: any; grid: any; - gridOptions: GridOption; - searchTerm: SearchTerm; + searchTerms: SearchTerm[]; columnDef: Column; callback: FilterCallback; filterType = FilterType.input; + /** Getter for the Grid Options pulled through the Grid Object */ + private get gridOptions(): GridOption { + return (this.grid && this.grid.getOptions) ? this.grid.getOptions() : {}; + } + /** * Initialize the Filter */ @@ -28,16 +32,16 @@ export class InputFilter implements Filter { this.grid = args.grid; this.callback = args.callback; this.columnDef = args.columnDef; - this.searchTerm = args.searchTerm || ''; - if (this.grid && typeof this.grid.getOptions === 'function') { - this.gridOptions = this.grid.getOptions(); - } + this.searchTerms = args.searchTerms || []; + + // filter input can only have 1 search term, so we will use the 1st array index if it exist + const searchTerm = (Array.isArray(this.searchTerms) && this.searchTerms[0]) || ''; // step 1, create HTML string template const filterTemplate = this.buildTemplateHtmlString(); // step 2, create the DOM Element of the filter & initialize it if searchTerm is filled - this.$filterElm = this.createDomElement(filterTemplate); + this.$filterElm = this.createDomElement(filterTemplate, searchTerm); // step 3, subscribe to the keyup event and run the callback when that happens // also add/remove "filled" class for styling purposes @@ -93,19 +97,20 @@ export class InputFilter implements Filter { * From the html template string, create a DOM element * @param filterTemplate */ - private createDomElement(filterTemplate: string) { + private createDomElement(filterTemplate: string, searchTerm?: SearchTerm) { const $headerElm = this.grid.getHeaderRowColumn(this.columnDef.id); $($headerElm).empty(); // create the DOM element & add an ID and filter class const $filterElm = $(filterTemplate); - const searchTerm = (typeof this.searchTerm === 'boolean') ? `${this.searchTerm}` : this.searchTerm; - $filterElm.val(searchTerm); + const searchTermInput = searchTerm as string; + + $filterElm.val(searchTermInput); $filterElm.attr('id', `filter-${this.columnDef.id}`); $filterElm.data('columnId', this.columnDef.id); // if there's a search term, we will add the "filled" class for styling purposes - if (this.searchTerm) { + if (searchTerm) { $filterElm.addClass('filled'); } diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/filters/multipleSelectFilter.ts b/aurelia-slickgrid/src/aurelia-slickgrid/filters/multipleSelectFilter.ts index babebcce4..325f535df 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/filters/multipleSelectFilter.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/filters/multipleSelectFilter.ts @@ -19,7 +19,6 @@ import * as $ from 'jquery'; export class MultipleSelectFilter implements Filter { $filterElm: any; grid: any; - gridOptions: GridOption; searchTerms: SearchTerm[]; columnDef: Column; callback: FilterCallback; @@ -62,6 +61,11 @@ export class MultipleSelectFilter implements Filter { }; } + /** Getter for the Grid Options pulled through the Grid Object */ + private get gridOptions(): GridOption { + return (this.grid && this.grid.getOptions) ? this.grid.getOptions() : {}; + } + /** * Initialize the filter template */ @@ -83,7 +87,6 @@ export class MultipleSelectFilter implements Filter { this.valueName = (this.columnDef.filter.customStructure) ? this.columnDef.filter.customStructure.value : 'value'; let newCollection = this.columnDef.filter.collection || []; - this.gridOptions = this.grid.getOptions(); // user might want to filter certain items of the collection if (this.gridOptions.params && this.columnDef.filter.collectionFilterBy) { diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/filters/selectFilter.ts b/aurelia-slickgrid/src/aurelia-slickgrid/filters/selectFilter.ts index 11263627d..b8dc757c2 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/filters/selectFilter.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/filters/selectFilter.ts @@ -14,7 +14,7 @@ import * as $ from 'jquery'; export class SelectFilter implements Filter { $filterElm: any; grid: any; - searchTerm: SearchTerm; + searchTerms: SearchTerm[]; columnDef: Column; callback: FilterCallback; filterType = FilterType.select; @@ -31,13 +31,19 @@ export class SelectFilter implements Filter { this.grid = args.grid; this.callback = args.callback; this.columnDef = args.columnDef; - this.searchTerm = args.searchTerm || ''; + this.searchTerms = args.searchTerms || []; + + // filter input can only have 1 search term, so we will use the 1st array index if it exist + let searchTerm = (Array.isArray(this.searchTerms) && this.searchTerms[0]) || ''; + if (typeof searchTerm === 'boolean' || typeof searchTerm === 'number') { + searchTerm = `${searchTerm}`; + } // step 1, create HTML string template const filterTemplate = this.buildTemplateHtmlString(); // step 2, create the DOM Element of the filter & initialize it if searchTerm is filled - this.$filterElm = this.createDomElement(filterTemplate); + this.$filterElm = this.createDomElement(filterTemplate, searchTerm); // step 3, subscribe to the change event and run the callback when that happens // also add/remove "filled" class for styling purposes @@ -107,14 +113,15 @@ export class SelectFilter implements Filter { * From the html template string, create a DOM element * @param filterTemplate */ - private createDomElement(filterTemplate: string) { + private createDomElement(filterTemplate: string, searchTerm?: SearchTerm) { const $headerElm = this.grid.getHeaderRowColumn(this.columnDef.id); $($headerElm).empty(); // create the DOM element & add an ID and filter class const $filterElm = $(filterTemplate); - const searchTerm = (typeof this.searchTerm === 'boolean') ? `${this.searchTerm}` : this.searchTerm; - $filterElm.val(searchTerm || ''); + const searchTermInput = (searchTerm || '') as string; + + $filterElm.val(searchTermInput); $filterElm.attr('id', `filter-${this.columnDef.id}`); $filterElm.data('columnId', this.columnDef.id); diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/filters/singleSelectFilter.ts b/aurelia-slickgrid/src/aurelia-slickgrid/filters/singleSelectFilter.ts index 88d66a907..c6a320cef 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/filters/singleSelectFilter.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/filters/singleSelectFilter.ts @@ -19,8 +19,7 @@ import * as $ from 'jquery'; export class SingleSelectFilter implements Filter { $filterElm: any; grid: any; - gridOptions: GridOption; - searchTerm: SearchTerm; + searchTerms: SearchTerm[]; columnDef: Column; callback: FilterCallback; defaultOptions: MultipleSelectOption; @@ -49,11 +48,16 @@ export class SingleSelectFilter implements Filter { this.isFilled = false; this.$filterElm.removeClass('filled').siblings('div .search-filter').removeClass('filled'); } - this.callback(undefined, { columnDef: this.columnDef, operator: 'EQ', searchTerm: selectedItem }); + this.callback(undefined, { columnDef: this.columnDef, operator: 'EQ', searchTerms: [selectedItem] }); } }; } + /** Getter for the Grid Options pulled through the Grid Object */ + private get gridOptions(): GridOption { + return (this.grid && this.grid.getOptions) ? this.grid.getOptions() : {}; + } + /** * Initialize the Filter */ @@ -64,7 +68,7 @@ export class SingleSelectFilter implements Filter { this.grid = args.grid; this.callback = args.callback; this.columnDef = args.columnDef; - this.searchTerm = args.searchTerm || ''; + this.searchTerms = args.searchTerms || []; if (!this.grid || !this.columnDef || !this.columnDef.filter || !this.columnDef.filter.collection) { throw new Error(`[Aurelia-SlickGrid] You need to pass a "collection" for the MultipleSelect Filter to work correctly. Also each option should include a value/label pair (or value/labelKey when using Locale). For example:: { filter: type: FilterType.multipleSelect, collection: [{ value: true, label: 'True' }, { value: false, label: 'False'}] }`); @@ -75,7 +79,6 @@ export class SingleSelectFilter implements Filter { this.valueName = (this.columnDef.filter.customStructure) ? this.columnDef.filter.customStructure.value : 'value'; let newCollection = this.columnDef.filter.collection || []; - this.gridOptions = this.grid.getOptions(); // user might want to filter certain items of the collection if (this.gridOptions.params && this.columnDef.filter.collectionFilterBy) { @@ -89,8 +92,13 @@ export class SingleSelectFilter implements Filter { newCollection = this.collectionService.sortCollection(newCollection, sortBy, this.enableTranslateLabel); } + let searchTerm = (Array.isArray(this.searchTerms) && this.searchTerms[0]) || ''; + if (typeof searchTerm === 'boolean' || typeof searchTerm === 'number') { + searchTerm = `${searchTerm}`; + } + // step 1, create HTML string template - const filterTemplate = this.buildTemplateHtmlString(newCollection || []); + const filterTemplate = this.buildTemplateHtmlString(newCollection || [], searchTerm); // step 2, create the DOM Element of the filter & pre-load search term this.createDomElement(filterTemplate); @@ -106,7 +114,7 @@ export class SingleSelectFilter implements Filter { this.$filterElm.multipleSelect('setSelects', []); if (triggerFilterChange) { - this.callback(undefined, { columnDef: this.columnDef, operator: 'IN', searchTerm: undefined }); + this.callback(undefined, { columnDef: this.columnDef, operator: 'IN', searchTerms: [] }); } } } @@ -123,7 +131,7 @@ export class SingleSelectFilter implements Filter { /** * Set value(s) on the DOM element */ - setValues(values: SearchTerm | SearchTerm[]) { + setValues(values: SearchTerm[]) { if (values) { values = Array.isArray(values) ? values : [values]; this.$filterElm.multipleSelect('setSelects', values); @@ -137,7 +145,7 @@ export class SingleSelectFilter implements Filter { /** * Create the HTML template as a string */ - private buildTemplateHtmlString(optionCollection: any[]) { + private buildTemplateHtmlString(optionCollection: any[], searchTerm?: SearchTerm) { let options = ''; optionCollection.forEach((option: SelectOption) => { if (!option || (option[this.labelName] === undefined && option.labelKey === undefined)) { @@ -145,7 +153,7 @@ export class SingleSelectFilter implements Filter { } const labelKey = (option.labelKey || option[this.labelName]) as string; - const selected = (option[this.valueName] === this.searchTerm) ? 'selected' : ''; + const selected = (option[this.valueName] === searchTerm) ? 'selected' : ''; const textLabel = ((option.labelKey || this.enableTranslateLabel) && this.i18n && typeof this.i18n.tr === 'function') ? this.i18n.tr(labelKey || ' ') : labelKey; // html text of each select option diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/models/columnFilter.interface.ts b/aurelia-slickgrid/src/aurelia-slickgrid/models/columnFilter.interface.ts index 1a5565651..c218d9eb6 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/models/columnFilter.interface.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/models/columnFilter.interface.ts @@ -23,9 +23,6 @@ export interface ColumnFilter { /** Custom Filter */ customFilter?: Filter; - /** Search term (singular) */ - searchTerm?: SearchTerm; - /** Search terms (collection) */ searchTerms?: SearchTerm[]; diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/models/currentFilter.interface.ts b/aurelia-slickgrid/src/aurelia-slickgrid/models/currentFilter.interface.ts index 607ba7f0e..3ba2d6d3a 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/models/currentFilter.interface.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/models/currentFilter.interface.ts @@ -3,6 +3,5 @@ import { OperatorString, OperatorType, SearchTerm } from './../models/index'; export interface CurrentFilter { columnId: string; operator?: OperatorType | OperatorString; - searchTerm?: SearchTerm; searchTerms?: SearchTerm[]; } diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/models/filter.interface.ts b/aurelia-slickgrid/src/aurelia-slickgrid/models/filter.interface.ts index 0497b3327..f5bd4aa73 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/models/filter.interface.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/models/filter.interface.ts @@ -22,9 +22,6 @@ export interface Filter { /** SlickGrid grid object */ grid: any; - /** Defined search term to pre-load */ - searchTerm?: SearchTerm; - /** Array of defined search terms to pre-load */ searchTerms?: SearchTerm[]; diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/models/filterArguments.interface.ts b/aurelia-slickgrid/src/aurelia-slickgrid/models/filterArguments.interface.ts index 01932c012..9ecb9b821 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/models/filterArguments.interface.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/models/filterArguments.interface.ts @@ -12,7 +12,6 @@ export interface FilterArguments { columnDef: Column; callback: FilterCallback; operator?: OperatorType | OperatorString; - searchTerm?: SearchTerm; searchTerms?: SearchTerm[]; i18n?: I18N; params?: any | any[]; diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/models/filterCallback.interface.ts b/aurelia-slickgrid/src/aurelia-slickgrid/models/filterCallback.interface.ts index a9c8fde66..682d8bf20 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/models/filterCallback.interface.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/models/filterCallback.interface.ts @@ -3,7 +3,6 @@ import { Column, OperatorString, SearchTerm } from './../models/index'; export interface FilterCallbackArg { columnDef: Column; operator?: OperatorString; - searchTerm?: SearchTerm; searchTerms?: SearchTerm[]; } diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/models/filterChangedArgs.interface.ts b/aurelia-slickgrid/src/aurelia-slickgrid/models/filterChangedArgs.interface.ts index 2ef091cfb..348c5ae23 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/models/filterChangedArgs.interface.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/models/filterChangedArgs.interface.ts @@ -4,6 +4,5 @@ import { SearchTerm } from './searchTerm.type'; export interface FilterChangedArgs { columnFilters: ColumnFilters; grid: any; - searchTerm: SearchTerm; searchTerms: SearchTerm[]; } diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/models/filterConditionOption.interface.ts b/aurelia-slickgrid/src/aurelia-slickgrid/models/filterConditionOption.interface.ts index 7bb279280..5979465ae 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/models/filterConditionOption.interface.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/models/filterConditionOption.interface.ts @@ -6,6 +6,5 @@ export interface FilterConditionOption { cellValueLastChar?: string; fieldType: FieldType; filterSearchType?: FieldType; - searchTerm?: string | number; searchTerms?: string[] | number[]; } diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/services/controlAndPlugin.service.ts b/aurelia-slickgrid/src/aurelia-slickgrid/services/controlAndPlugin.service.ts index f7e1aefbe..12c4b4e13 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/services/controlAndPlugin.service.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/services/controlAndPlugin.service.ts @@ -617,7 +617,7 @@ export class ControlAndPluginService { this._gridOptions.columnPicker = { hideForceFitButton: tempHideForceFit, hideSyncResizeButton: tempSyncResize - } + }; this.createColumnPicker(this._grid, this.visibleColumns); } diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/services/filter.service.ts b/aurelia-slickgrid/src/aurelia-slickgrid/services/filter.service.ts index a9e31b5f6..1e5ae9098 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/services/filter.service.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/services/filter.service.ts @@ -172,7 +172,7 @@ export class FilterService { let cellValue = item[columnDef.queryField || columnDef.queryFieldFilter || columnDef.field]; const searchTerms = (columnFilter && columnFilter.searchTerms) ? columnFilter.searchTerms : null; - let fieldSearchValue = (columnFilter && (columnFilter.searchTerm !== undefined || columnFilter.searchTerm !== null)) ? columnFilter.searchTerm : undefined; + let fieldSearchValue = (Array.isArray(searchTerms) && searchTerms.length === 1) ? searchTerms[0] : ''; if (typeof fieldSearchValue === 'undefined') { fieldSearchValue = ''; @@ -184,7 +184,7 @@ export class FilterService { const searchTerm = (!!matches) ? matches[2] : ''; const lastValueChar = (!!matches) ? matches[3] : (operator === '*z' ? '*' : ''); - if (searchTerms && searchTerms.length > 0) { + if (searchTerms && searchTerms.length > 1) { fieldSearchValue = searchTerms.join(','); } else if (typeof fieldSearchValue === 'string') { // escaping the search value @@ -240,7 +240,6 @@ export class FilterService { const conditionOptions = { fieldType, searchTerms, - searchTerm, cellValue, operator, cellValueLastChar: lastValueChar, @@ -300,8 +299,6 @@ export class FilterService { if (columnFilter && columnFilter.searchTerms) { filter.searchTerms = columnFilter.searchTerms; - } else { - filter.searchTerm = (columnFilter && (columnFilter.searchTerm !== undefined || columnFilter.searchTerm !== null)) ? columnFilter.searchTerm : undefined; } if (columnFilter.operator) { filter.operator = columnFilter.operator; @@ -314,13 +311,13 @@ export class FilterService { callbackSearchEvent(e: Event | undefined, args: FilterCallbackArg) { if (args) { - const searchTerm = args.searchTerm ? args.searchTerm : ((e && e.target) ? (e.target as HTMLInputElement).value : undefined); - const searchTerms = (args.searchTerms && Array.isArray(args.searchTerms)) ? args.searchTerms : undefined; + const searchTerm = ((e && e.target) ? (e.target as HTMLInputElement).value : undefined); + const searchTerms = (args.searchTerms && Array.isArray(args.searchTerms)) ? args.searchTerms : searchTerm ? [searchTerm] : undefined; const columnDef = args.columnDef || null; const columnId = columnDef ? (columnDef.id || '') : ''; const operator = args.operator || undefined; - if (!searchTerm && (!searchTerms || (Array.isArray(searchTerms) && searchTerms.length === 0))) { + if (!searchTerms || (Array.isArray(searchTerms) && searchTerms.length === 0)) { // delete the property from the columnFilters when it becomes empty // without doing this, it would leave an incorrect state of the previous column filters when filtering on another column delete this._columnFilters[columnId]; @@ -329,7 +326,6 @@ export class FilterService { const colFilter: ColumnFilter = { columnId: colId, columnDef, - searchTerm, searchTerms, }; if (operator) { @@ -343,7 +339,6 @@ export class FilterService { columnDef: args.columnDef || null, columnFilters: this._columnFilters, operator, - searchTerm, searchTerms, serviceOptions: this._onFilterChangedOptions, grid: this._grid @@ -357,26 +352,22 @@ export class FilterService { if (columnDef && columnId !== 'selector' && columnDef.filterable) { let searchTerms: SearchTerm[] | undefined; - let searchTerm: SearchTerm | undefined; let operator: OperatorString | OperatorType | undefined; if (this._columnFilters[columnDef.id]) { - searchTerm = this._columnFilters[columnDef.id].searchTerm || undefined; searchTerms = this._columnFilters[columnDef.id].searchTerms || undefined; operator = this._columnFilters[columnDef.id].operator || undefined; } else if (columnDef.filter) { // when hiding/showing (with Column Picker or Grid Menu), it will try to re-create yet again the filters (since SlickGrid does a re-render) // because of that we need to first get searchTerm(s) from the columnFilters (that is what the user last entered) searchTerms = columnDef.filter.searchTerms || undefined; - searchTerm = columnDef.filter.searchTerm || undefined; operator = columnDef.filter.operator || undefined; - this.updateColumnFilters(searchTerm, searchTerms, columnDef); + this.updateColumnFilters(searchTerms, columnDef); } const filterArguments: FilterArguments = { grid: this._grid, operator, - searchTerm, searchTerms, columnDef, callback: this.callbackSearchEvent.bind(this) @@ -412,8 +403,8 @@ export class FilterService { // when hiding/showing (with Column Picker or Grid Menu), it will try to re-create yet again the filters (since SlickGrid does a re-render) // we need to also set again the values in the DOM elements if the values were set by a searchTerm(s) - if ((searchTerm || searchTerms) && filter.setValues) { - filter.setValues(searchTerm || searchTerms); + if (searchTerms && filter.setValues) { + filter.setValues(searchTerms); } } } @@ -451,11 +442,6 @@ export class FilterService { const columnPreset = filters.find((presetFilter: CurrentFilter) => { return presetFilter.columnId === columnDef.id; }); - if (columnPreset && columnPreset.searchTerm) { - columnDef.filter = columnDef.filter || {}; - columnDef.filter.operator = columnPreset.operator; - columnDef.filter.searchTerm = columnPreset.searchTerm; - } if (columnPreset && columnPreset.searchTerms) { columnDef.filter = columnDef.filter || {}; columnDef.filter.operator = columnPreset.operator || columnDef.filter.operator || OperatorType.in; @@ -466,16 +452,7 @@ export class FilterService { return this._columnDefinitions; } - private updateColumnFilters(searchTerm: SearchTerm | undefined, searchTerms: SearchTerm[] | undefined, columnDef: any) { - if (searchTerm !== undefined && searchTerm !== null && searchTerm !== '') { - this._columnFilters[columnDef.id] = { - columnId: columnDef.id, - columnDef, - searchTerm, - operator: (columnDef && columnDef.filter && columnDef.filter.operator) ? columnDef.filter.operator : null, - type: (columnDef && columnDef.filter && columnDef.filter.type) ? columnDef.filter.type : FilterType.input - }; - } + private updateColumnFilters(searchTerms: SearchTerm[] | undefined, columnDef: any) { if (searchTerms) { // this._columnFilters.searchTerms = searchTerms; this._columnFilters[columnDef.id] = { diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/services/graphql.service.ts b/aurelia-slickgrid/src/aurelia-slickgrid/services/graphql.service.ts index d282f5955..4b1b5fd22 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/services/graphql.service.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/services/graphql.service.ts @@ -361,7 +361,7 @@ export class GraphqlService implements BackendService { const fieldName = columnDef.queryField || columnDef.queryFieldFilter || columnDef.field || columnDef.name || ''; const searchTerms = (columnFilter ? columnFilter.searchTerms : null) || []; - let fieldSearchValue = columnFilter.searchTerm; + let fieldSearchValue = (Array.isArray(searchTerms) && searchTerms.length === 1) ? searchTerms[0] : ''; if (typeof fieldSearchValue === 'undefined') { fieldSearchValue = ''; } @@ -382,7 +382,7 @@ export class GraphqlService implements BackendService { } // when having more than 1 search term (we need to create a CSV string for GraphQL "IN" or "NOT IN" filter search) - if (searchTerms && searchTerms.length > 0) { + if (searchTerms && searchTerms.length > 1) { searchValue = searchTerms.join(','); } else if (typeof searchValue === 'string') { // escaping the search value @@ -557,9 +557,8 @@ export class GraphqlService implements BackendService { } if (Array.isArray(filter.searchTerms)) { tmpFilter.searchTerms = filter.searchTerms; - } else { - tmpFilter.searchTerm = filter.searchTerm; } + return tmpFilter; }); } diff --git a/aurelia-slickgrid/src/aurelia-slickgrid/services/grid-odata.service.ts b/aurelia-slickgrid/src/aurelia-slickgrid/services/grid-odata.service.ts index 8c2c8a41d..f46ff1af4 100644 --- a/aurelia-slickgrid/src/aurelia-slickgrid/services/grid-odata.service.ts +++ b/aurelia-slickgrid/src/aurelia-slickgrid/services/grid-odata.service.ts @@ -210,7 +210,7 @@ export class GridOdataService implements BackendService { let fieldName = columnDef.queryField || columnDef.queryFieldFilter || columnDef.field || columnDef.name || ''; const fieldType = columnDef.type || 'string'; const searchTerms = (columnFilter ? columnFilter.searchTerms : null) || []; - let fieldSearchValue = columnFilter.searchTerm; + let fieldSearchValue = (Array.isArray(searchTerms) && searchTerms.length === 1) ? searchTerms[0] : ''; if (typeof fieldSearchValue === 'undefined') { fieldSearchValue = ''; } @@ -227,7 +227,7 @@ export class GridOdataService implements BackendService { const bypassOdataQuery = columnFilter.bypassBackendQuery || false; // no need to query if search value is empty - if (fieldName && searchValue === '') { + if (fieldName && searchValue === '' && searchTerms.length === 0) { this.removeColumnFilter(fieldName); continue; } @@ -250,7 +250,7 @@ export class GridOdataService implements BackendService { } // when having more than 1 search term (then check if we have a "IN" or "NOT IN" filter search) - if (searchTerms && searchTerms.length > 0) { + if (searchTerms && searchTerms.length > 1) { const tmpSearchTerms = []; if (operator === 'IN') { @@ -412,9 +412,8 @@ export class GridOdataService implements BackendService { } if (Array.isArray(filter.searchTerms)) { tmpFilter.searchTerms = filter.searchTerms; - } else { - tmpFilter.searchTerm = filter.searchTerm; } + return tmpFilter; }); } diff --git a/aurelia-slickgrid/src/examples/slickgrid/custom-inputFilter.ts b/aurelia-slickgrid/src/examples/slickgrid/custom-inputFilter.ts index 9ab3f7ae0..00066400b 100644 --- a/aurelia-slickgrid/src/examples/slickgrid/custom-inputFilter.ts +++ b/aurelia-slickgrid/src/examples/slickgrid/custom-inputFilter.ts @@ -4,7 +4,7 @@ import * as $ from 'jquery'; export class CustomInputFilter implements Filter { private $filterElm: any; grid: any; - searchTerm: SearchTerm; + searchTerms: SearchTerm[]; columnDef: Column; callback: FilterCallback; @@ -15,13 +15,16 @@ export class CustomInputFilter implements Filter { this.grid = args.grid; this.callback = args.callback; this.columnDef = args.columnDef; - this.searchTerm = args.searchTerm; + this.searchTerms = args.searchTerms || []; + + // filter input can only have 1 search term, so we will use the 1st array index if it exist + const searchTerm = (Array.isArray(this.searchTerms) && this.searchTerms[0]) || ''; // step 1, create HTML string template const filterTemplate = this.buildTemplateHtmlString(); // step 2, create the DOM Element of the filter & initialize it if searchTerm is filled - this.$filterElm = this.createDomElement(filterTemplate); + this.$filterElm = this.createDomElement(filterTemplate, searchTerm); // step 3, subscribe to the keyup event and run the callback when that happens this.$filterElm.keyup((e: any) => this.callback(e, { columnDef: this.columnDef })); @@ -72,14 +75,15 @@ export class CustomInputFilter implements Filter { * From the html template string, create a DOM element * @param filterTemplate */ - private createDomElement(filterTemplate: string) { + private createDomElement(filterTemplate: string, searchTerm?: SearchTerm) { const $headerElm = this.grid.getHeaderRowColumn(this.columnDef.id); $($headerElm).empty(); // create the DOM element & add an ID and filter class const $filterElm = $(filterTemplate); - const searchTerm = (typeof this.searchTerm === 'boolean') ? `${this.searchTerm}` : this.searchTerm; - $filterElm.val(searchTerm); + const searchTermInput = searchTerm as string; + + $filterElm.val(searchTermInput); $filterElm.attr('id', `filter-${this.columnDef.id}`); $filterElm.data('columnId', this.columnDef.id); diff --git a/aurelia-slickgrid/src/examples/slickgrid/example10.ts b/aurelia-slickgrid/src/examples/slickgrid/example10.ts index e84444ec7..f1b63cf59 100644 --- a/aurelia-slickgrid/src/examples/slickgrid/example10.ts +++ b/aurelia-slickgrid/src/examples/slickgrid/example10.ts @@ -7,6 +7,8 @@ export class Example2 { subTitle = ` Row selection, single or multi-select (Wiki docs). `; diff --git a/aurelia-slickgrid/src/examples/slickgrid/example4.ts b/aurelia-slickgrid/src/examples/slickgrid/example4.ts index e45d49e98..884ce0f21 100644 --- a/aurelia-slickgrid/src/examples/slickgrid/example4.ts +++ b/aurelia-slickgrid/src/examples/slickgrid/example4.ts @@ -144,9 +144,9 @@ export class Example4 { presets: { filters: [ { columnId: 'duration', searchTerms: [2, 22, 44] }, - // { columnId: 'complete', searchTerm: '5', operator: '>' }, - { columnId: 'usDateShort', operator: '<', searchTerm: '4/20/25' }, - // { columnId: 'effort-driven', searchTerm: true } + // { columnId: 'complete', searchTerms: ['5'], operator: '>' }, + { columnId: 'usDateShort', operator: '<', searchTerms: ['4/20/25'] }, + // { columnId: 'effort-driven', searchTerms: [true] } ], sorters: [ { columnId: 'duration', direction: 'DESC' }, diff --git a/aurelia-slickgrid/src/examples/slickgrid/example6.ts b/aurelia-slickgrid/src/examples/slickgrid/example6.ts index c873670b1..b2e20d844 100644 --- a/aurelia-slickgrid/src/examples/slickgrid/example6.ts +++ b/aurelia-slickgrid/src/examples/slickgrid/example6.ts @@ -117,8 +117,8 @@ export class Example6 { presets: { // you can also type operator as string, e.g.: operator: 'EQ' filters: [ - { columnId: 'gender', searchTerm: 'male', operator: OperatorType.equal }, - { columnId: 'name', searchTerm: 'John Doe', operator: OperatorType.contains }, + { columnId: 'gender', searchTerms: ['male'], operator: OperatorType.equal }, + { columnId: 'name', searchTerms: ['John Doe'], operator: OperatorType.contains }, { columnId: 'company', searchTerms: ['xyz'], operator: 'IN' } ], sorters: [