all files / grid/actions/ filter.js

94.44% Statements 493/522
87.94% Branches 299/340
98% Functions 49/50
94.43% Lines 492/521
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288 289 290 291 292 293 294 295 296 297 298 299 300 301 302 303 304 305 306 307 308 309 310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325 326 327 328 329 330 331 332 333 334 335 336 337 338 339 340 341 342 343 344 345 346 347 348 349 350 351 352 353 354 355 356 357 358 359 360 361 362 363 364 365 366 367 368 369 370 371 372 373 374 375 376 377 378 379 380 381 382 383 384 385 386 387 388 389 390 391 392 393 394 395 396 397 398 399 400 401 402 403 404 405 406 407 408 409 410 411 412 413 414 415 416 417 418 419 420 421 422 423 424 425 426 427 428 429 430 431 432 433 434 435 436 437 438 439 440 441 442 443 444 445 446 447 448 449 450 451 452 453 454 455 456 457 458 459 460 461 462 463 464 465 466 467 468 469 470 471 472 473 474 475 476 477 478 479 480 481 482 483 484 485 486 487 488 489 490 491 492 493 494 495 496 497 498 499 500 501 502 503 504 505 506 507 508 509 510 511 512 513 514 515 516 517 518 519 520 521 522 523 524 525 526 527 528 529 530 531 532 533 534 535 536 537 538 539 540 541 542 543 544 545 546 547 548 549 550 551 552 553 554 555 556 557 558 559 560 561 562 563 564 565 566 567 568 569 570 571 572 573 574 575 576 577 578 579 580 581 582 583 584 585 586 587 588 589 590 591 592 593 594 595 596 597 598 599 600 601 602 603 604 605 606 607 608 609 610 611 612 613 614 615 616 617 618 619 620 621 622 623 624 625 626 627 628 629 630 631 632 633 634 635 636 637 638 639 640 641 642 643 644 645 646 647 648 649 650 651 652 653 654 655 656 657 658 659 660 661 662 663 664 665 666 667 668 669 670 671 672 673 674 675 676 677 678 679 680 681 682 683 684 685 686 687 688 689 690 691 692 693 694 695 696 697 698 699 700 701 702 703 704 705 706 707 708 709 710 711 712 713 714 715 716 717 718 719 720 721 722 723 724 725 726 727 728 729 730 731 732 733 734 735 736 737 738 739 740 741 742 743 744 745 746 747 748 749 750 751 752 753 754 755 756 757 758 759 760 761 762 763 764 765 766 767 768 769 770 771 772 773 774 775 776 777 778 779 780 781 782 783 784 785 786 787 788 789 790 791 792 793 794 795 796 797 798 799 800 801 802 803 804 805 806 807 808   108× 108× 108× 108× 108× 108×       108× 108× 108× 108× 108× 108×   167×   161× 161× 161× 161× 125× 125× 125×   125× 125× 125× 125× 125× 125× 125× 125× 125× 125× 125× 125× 18×   125× 125× 14×   125× 125×       75× 14×   75× 75× 75× 75× 75× 56× 56× 56×       125× 125× 125× 125×   125× 125× 83× 14×     125× 18×   125× 775× 775×   125×   807×               807×   62× 62× 62×       62× 62×     56×   62× 62×   62× 62× 18×     56×   127×             127× 126×   125×   75×   11×     105× 105×       108×     108× 108× 108× 108× 108× 108× 108× 108× 108× 108× 108×   75× 75× 73×     87×   73× 73× 73× 73× 53×   73×   71×         67× 67× 67× 67× 67× 67× 67× 67× 30×   67× 67×         67× 29×   67×     58×   67×                 67× 67×   62×   15×   15×   235× 135×   100× 100× 100×   94× 93×         93× 93× 93×   94×                 102× 51× 57×   57× 57× 57×     51× 51×   57× 57× 50×     51× 16× 16×               73× 73× 73× 63×   73×     27× 27×   25× 23×   25×             25× 25× 25×   67× 67× 23× 23×       62×           94× 94× 79×   94× 94× 94×                       35× 35× 35×   33× 33×   33× 33× 24× 24× 24× 24×   33× 33× 33× 33×   33× 33× 33×   33×   33×           33×     33×   8212×   78× 78× 78× 37× 37× 37×     37× 36× 36×               268× 185× 185× 185× 185× 185× 185× 185×   183× 77× 77× 95×   95× 18×   95×               86×       183× 36×   183×     19× 19×   67× 67× 67× 28× 28×       39× 26× 26× 77× 77×         67×   36× 36×   36× 36×   70×   34× 34× 34×   34× 34× 34×                   34×   34×   33× 33× 33× 33×   33× 33× 33× 33× 33×   16× 16× 16× 41×     16× 16×   16× 16×   16×   16×             11× 11×   10×         11×                 17× 17× 17× 17×         17×       12×     161×               161×                                   243× 243×   91× 91× 91× 91× 91× 91×     91× 79×   91× 91×     2913×   484× 484× 484× 484× 56×   428×       338×   428×           42× 42× 42× 42× 42× 42× 38× 38× 68× 38× 38×     38× 38×     42×   42× 42× 42× 28× 28× 28×       14× 14×   14×   42×   93× 93× 184×   184× 184× 15×   184×     184×                 184×   251× 251× 251× 146×          
define(["require", "exports", "@syncfusion/ej2-base", "../base/util", "@syncfusion/ej2-base", "@syncfusion/ej2-data", "../base/constant", "../base/enum", "../renderer/row-renderer", "../models/cell", "../models/row", "../renderer/filter-cell-renderer", "../base/util", "../renderer/filter-menu-renderer", "../actions/checkbox-filter", "../actions/excel-filter"], function (require, exports, ej2_base_1, util_1, ej2_base_2, ej2_data_1, events, enum_1, row_renderer_1, cell_1, row_1, filter_cell_renderer_1, util_2, filter_menu_renderer_1, checkbox_filter_1, excel_filter_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var Filter = (function () {
        function Filter(parent, filterSettings, serviceLocator) {
            this.predicate = 'and';
            this.contentRefresh = true;
            this.values = {};
            this.nextFlMenuOpen = '';
            this.type = { 'Menu': filter_menu_renderer_1.FilterMenuRenderer, 'CheckBox': checkbox_filter_1.CheckBoxFilter, 'Excel': excel_filter_1.ExcelFilter };
            this.filterOperators = {
                contains: 'contains', endsWith: 'endswith', equal: 'equal', greaterThan: 'greaterthan', greaterThanOrEqual: 'greaterthanorequal',
                lessThan: 'lessthan', lessThanOrEqual: 'lessthanorequal', notEqual: 'notequal', startsWith: 'startswith'
            };
            this.fltrDlgDetails = { field: '', isOpen: false };
            this.actualPredicate = {};
            this.parent = parent;
            this.filterSettings = filterSettings;
            this.serviceLocator = serviceLocator;
            this.addEventListener();
        }
        Filter.prototype.render = function (e) {
            if (ej2_data_1.DataUtil.getObject('args.isFrozen', e)) {
                return;
            }
            var gObj = this.parent;
            this.l10n = this.serviceLocator.getService('localization');
            this.getLocalizedCustomOperators();
            if (this.parent.filterSettings.type === 'FilterBar') {
                Eif (gObj.columns.length) {
                    var fltrElem = this.parent.element.querySelector('.e-filterbar');
                    if (fltrElem) {
                        ej2_base_2.remove(fltrElem);
                    }
                    var rowRenderer = new row_renderer_1.RowRenderer(this.serviceLocator, enum_1.CellType.Filter, gObj);
                    var row = void 0;
                    var cellrender = this.serviceLocator.getService('cellRendererFactory');
                    cellrender.addCellRenderer(enum_1.CellType.Filter, new filter_cell_renderer_1.FilterCellRenderer(this.parent, this.serviceLocator));
                    this.valueFormatter = this.serviceLocator.getService('valueFormatter');
                    rowRenderer.element = ej2_base_2.createElement('tr', { className: 'e-filterbar' });
                    row = this.generateRow();
                    row.data = this.values;
                    this.parent.getHeaderContent().querySelector('thead').appendChild(rowRenderer.element);
                    this.element = rowRenderer.render(row, gObj.getColumns(), null, null, rowRenderer.element);
                    var detail = this.element.querySelector('.e-detailheadercell');
                    if (detail) {
                        detail.className = 'e-filterbarcell e-mastercell';
                    }
                    var gCells = [].slice.call(this.element.querySelectorAll('.e-grouptopleftcell'));
                    if (gCells.length) {
                        gCells[gCells.length - 1].classList.add('e-lastgrouptopleftcell');
                    }
                    this.wireEvents();
                    this.parent.notify(events.freezeRender, { case: 'filter' });
                }
            }
        };
        Filter.prototype.destroy = function () {
            if (this.filterModule) {
                this.filterModule.destroy();
            }
            this.filterSettings.columns = [];
            this.updateFilterMsg();
            this.removeEventListener();
            this.unWireEvents();
            if (this.element) {
                ej2_base_2.remove(this.element);
                var filterBarElement = this.parent.getHeaderContent().querySelector('.e-filterbar');
                if (this.parent.getFrozenColumns() && filterBarElement) {
                    ej2_base_2.remove(filterBarElement);
                }
            }
        };
        Filter.prototype.generateRow = function (index) {
            var options = {};
            var row = new row_1.Row(options);
            row.cells = this.generateCells();
            return row;
        };
        Filter.prototype.generateCells = function () {
            var cells = [];
            if (this.parent.allowGrouping) {
                for (var c = 0, len = this.parent.groupSettings.columns.length; c < len; c++) {
                    cells.push(this.generateCell({}, enum_1.CellType.HeaderIndent));
                }
            }
            if (this.parent.detailTemplate || this.parent.childGrid) {
                cells.push(this.generateCell({}, enum_1.CellType.DetailHeader));
            }
            for (var _i = 0, _a = this.parent.getColumns(); _i < _a.length; _i++) {
                var dummy = _a[_i];
                cells.push(this.generateCell(dummy));
            }
            return cells;
        };
        Filter.prototype.generateCell = function (column, cellType) {
            var opt = {
                'visible': column.visible,
                'isDataCell': false,
                'rowId': '',
                'column': column,
                'cellType': cellType ? cellType : enum_1.CellType.Filter,
                'attributes': { title: this.l10n.getConstant('FilterbarTitle') }
            };
            return new cell_1.Cell(opt);
        };
        Filter.prototype.updateModel = function () {
            var col = this.parent.getColumnByField(this.fieldName);
            var field = col.isForeignColumn() ? col.foreignKeyValue : this.fieldName;
            this.currentFilterObject = {
                field: field, operator: this.operator, value: this.value, predicate: this.predicate,
                matchCase: this.matchCase, ignoreAccent: this.ignoreAccent, actualFilterValue: {}, actualOperator: {}
            };
            var index = this.getFilteredColsIndexByField(col);
            if (index > -1) {
                this.filterSettings.columns[index] = this.currentFilterObject;
            }
            else {
                this.filterSettings.columns.push(this.currentFilterObject);
            }
            this.filterSettings.columns = this.filterSettings.columns;
            this.parent.dataBind();
        };
        Filter.prototype.getFilteredColsIndexByField = function (col) {
            var cols = this.filterSettings.columns;
            for (var i = 0, len = cols.length; i < len; i++) {
                if (cols[i].field === col.field || (col.isForeignColumn() && cols[i].field === col.foreignKeyValue)) {
                    return i;
                }
            }
            return -1;
        };
        Filter.prototype.onActionComplete = function (e) {
            var args = !this.isRemove ? {
                currentFilterObject: this.currentFilterObject,
                currentFilteringColumn: !ej2_base_1.isNullOrUndefined(this.column) ? this.column.field : undefined,
                columns: this.filterSettings.columns, requestType: 'filtering', type: events.actionComplete
            } : {
                requestType: 'filtering', type: events.actionComplete
            };
            this.parent.trigger(events.actionComplete, ej2_base_1.extend(e, args));
            this.isRemove = false;
        };
        Filter.prototype.wireEvents = function () {
            ej2_base_1.EventHandler.add(this.parent.getHeaderContent(), 'keyup', this.keyUpHandler, this);
        };
        Filter.prototype.unWireEvents = function () {
            ej2_base_1.EventHandler.remove(this.parent.getHeaderContent(), 'keyup', this.keyUpHandler);
        };
        Filter.prototype.enableAfterRender = function (e) {
            if (e.module === this.getModuleName() && e.enable) {
                this.render();
            }
        };
        Filter.prototype.initialEnd = function () {
            this.parent.off(events.contentReady, this.initialEnd);
            if (this.parent.getColumns().length && this.filterSettings.columns.length) {
                var gObj = this.parent;
                this.contentRefresh = false;
                for (var _i = 0, _a = gObj.filterSettings.columns; _i < _a.length; _i++) {
                    var col = _a[_i];
                    this.filterByColumn(col.field, col.operator, col.value, col.predicate, col.matchCase, col.ignoreAccent, col.actualFilterValue, col.actualOperator);
                }
                this.updateFilterMsg();
                this.contentRefresh = true;
            }
        };
        Filter.prototype.addEventListener = function () {
            Iif (this.parent.isDestroyed) {
                return;
            }
            this.parent.on(events.uiUpdate, this.enableAfterRender, this);
            this.parent.on(events.filterComplete, this.onActionComplete, this);
            this.parent.on(events.inBoundModelChanged, this.onPropertyChanged, this);
            this.parent.on(events.keyPressed, this.keyUpHandler, this);
            this.parent.on(events.columnPositionChanged, this.columnPositionChanged, this);
            this.parent.on(events.headerRefreshed, this.render, this);
            this.parent.on(events.contentReady, this.initialEnd, this);
            this.parent.on(events.filterMenuClose, this.filterMenuClose, this);
            ej2_base_1.EventHandler.add(document, 'click', this.clickHandler, this);
            this.parent.on(events.filterOpen, this.columnMenuFilter, this);
            this.parent.on(events.click, this.filterIconClickHandler, this);
        };
        Filter.prototype.removeEventListener = function () {
            ej2_base_1.EventHandler.remove(document, 'click', this.clickHandler);
            if (this.parent.isDestroyed) {
                return;
            }
            this.parent.off(events.uiUpdate, this.enableAfterRender);
            this.parent.off(events.filterComplete, this.onActionComplete);
            this.parent.off(events.inBoundModelChanged, this.onPropertyChanged);
            this.parent.off(events.keyPressed, this.keyUpHandler);
            this.parent.off(events.columnPositionChanged, this.columnPositionChanged);
            this.parent.off(events.headerRefreshed, this.render);
            this.parent.off(events.filterOpen, this.columnMenuFilter);
            this.parent.off(events.filterMenuClose, this.filterMenuClose);
            this.parent.off(events.click, this.filterIconClickHandler);
        };
        Filter.prototype.filterMenuClose = function (args) {
            this.fltrDlgDetails.isOpen = false;
        };
        Filter.prototype.filterByColumn = function (fieldName, filterOperator, filterValue, predicate, matchCase, ignoreAccent, actualFilterValue, actualOperator) {
            var gObj = this.parent;
            var filterCell;
            this.column = gObj.getColumnByField(fieldName);
            if (this.filterSettings.type === 'FilterBar') {
                filterCell = gObj.getHeaderContent().querySelector('[id=\'' + this.column.field + '_filterBarcell\']');
            }
            if (!ej2_base_1.isNullOrUndefined(this.column.allowFiltering) && !this.column.allowFiltering) {
                return;
            }
            if (util_1.isActionPrevent(gObj)) {
                gObj.notify(events.preventBatch, {
                    instance: this, handler: this.filterByColumn, arg1: fieldName, arg2: filterOperator, arg3: filterValue, arg4: predicate,
                    arg5: matchCase, arg6: ignoreAccent, arg7: actualFilterValue, arg8: actualOperator
                });
                return;
            }
            this.value = filterValue;
            this.matchCase = matchCase || false;
            this.ignoreAccent = this.ignoreAccent = !ej2_base_1.isNullOrUndefined(ignoreAccent) ? ignoreAccent : this.parent.filterSettings.ignoreAccent;
            this.fieldName = fieldName;
            this.predicate = predicate || 'and';
            this.operator = filterOperator;
            filterValue = !ej2_base_1.isNullOrUndefined(filterValue) && filterValue.toString();
            if (this.column.type === 'number' || this.column.type === 'date') {
                this.matchCase = true;
            }
            gObj.getColumnHeaderByField(fieldName).setAttribute('aria-filtered', 'true');
            Iif (filterValue.length < 1 || this.checkForSkipInput(this.column, filterValue)) {
                this.filterStatusMsg = filterValue.length < 1 ? '' : this.l10n.getConstant('InvalidFilterMessage');
                this.updateFilterMsg();
                return;
            }
            if (this.filterSettings.type === 'FilterBar' && filterCell.value !== filterValue) {
                filterCell.value = filterValue;
            }
            if (!ej2_base_1.isNullOrUndefined(this.column.format)) {
                this.applyColumnFormat(filterValue);
            }
            else {
                this.values[this.column.field] = filterValue;
            }
            this.actualPredicate[this.fieldName] = [{
                    field: this.fieldName,
                    predicate: predicate,
                    matchCase: matchCase,
                    ignoreAccent: ignoreAccent,
                    operator: this.operator,
                    value: this.value,
                    type: this.column.type
                }];
            this.addFilteredClass(this.fieldName);
            if (this.checkAlreadyColFiltered(this.column.field)) {
                return;
            }
            this.updateModel();
        };
        Filter.prototype.applyColumnFormat = function (filterValue) {
            var getFlvalue = (this.column.type === 'date' || this.column.type === 'datetime') ?
                new Date(filterValue) : parseFloat(filterValue);
            this.values[this.column.field] = this.setFormatForFlColumn(getFlvalue, this.column);
        };
        Filter.prototype.onPropertyChanged = function (e) {
            if (e.module !== this.getModuleName()) {
                return;
            }
            for (var _i = 0, _a = Object.keys(e.properties); _i < _a.length; _i++) {
                var prop = _a[_i];
                switch (prop) {
                    case 'columns':
                        if (this.contentRefresh) {
                            this.parent.notify(events.modelChanged, {
                                currentFilterObject: this.currentFilterObject, currentFilteringColumn: this.column ?
                                    this.column.field : undefined,
                                columns: this.filterSettings.columns, requestType: 'filtering', type: events.actionBegin
                            });
                            this.refreshFilterSettings();
                            this.updateFilterMsg();
                            this.updateFilter();
                        }
                        break;
                    case 'showFilterBarStatus':
                        Iif (e.properties[prop]) {
                            this.updateFilterMsg();
                        }
                        else Eif (this.parent.allowPaging) {
                            this.parent.updateExternalMessage('');
                        }
                        break;
                    case 'type':
                        this.parent.refreshHeader();
                        this.refreshFilterSettings();
                        break;
                }
            }
        };
        Filter.prototype.refreshFilterSettings = function () {
            if (this.filterSettings.type === 'FilterBar') {
                for (var i = 0; i < this.filterSettings.columns.length; i++) {
                    this.column = this.parent.getColumnByField(this.filterSettings.columns[i].field) ||
                        util_1.getColumnByForeignKeyValue(this.filterSettings.columns[i].field, this.parent.getForeignKeyColumns());
                    var filterValue = this.filterSettings.columns[i].value;
                    filterValue = !ej2_base_1.isNullOrUndefined(filterValue) && filterValue.toString();
                    if (!ej2_base_1.isNullOrUndefined(this.column.format)) {
                        this.applyColumnFormat(filterValue);
                    }
                    else {
                        var key = this.filterSettings.columns[i].field;
                        this.values[key] = this.filterSettings.columns[i].value;
                    }
                    var filterElement = this.getFilterBarElement(this.filterSettings.columns[i].field);
                    if (filterElement) {
                        filterElement.value = this.filterSettings.columns[i].value;
                    }
                }
                if (this.filterSettings.columns.length === 0) {
                    var col = this.parent.getColumns();
                    for (var i = 0; i < col.length; i++) {
                        var filterElement = this.getFilterBarElement(col[i].field);
                        Iif (filterElement && filterElement.value !== '') {
                            filterElement.value = '';
                            delete this.values[col[i].field];
                        }
                    }
                }
            }
        };
        Filter.prototype.getFilterBarElement = function (col) {
            var selector = '[id=\'' + col + '_filterBarcell\']';
            var filterElement;
            if (selector && !ej2_base_1.isNullOrUndefined(this.element)) {
                filterElement = this.element.querySelector(selector);
            }
            return filterElement;
        };
        Filter.prototype.refreshFilter = function () {
            this.refreshFilterSettings();
            this.updateFilterMsg();
        };
        Filter.prototype.clearFiltering = function () {
            var cols = util_1.getActualPropFromColl(this.filterSettings.columns);
            if (util_1.isActionPrevent(this.parent)) {
                this.parent.notify(events.preventBatch, { instance: this, handler: this.clearFiltering });
                return;
            }
            for (var i = 0, len = cols.length; i < len; i++) {
                this.removeFilteredColsByField(cols[i].field, false);
            }
            Iif (this.parent.filterSettings.columns.length === 0 && this.parent.element.querySelector('.e-filtered')) {
                var fltrElement = [].slice.call(this.parent.element.querySelectorAll('.e-filtered'));
                for (var i = 0, len = fltrElement.length; i < len; i++) {
                    fltrElement[0].removeAttribute('aria-filtered');
                    fltrElement[0].classList.remove('e-filtered');
                }
            }
            this.isRemove = true;
            this.filterStatusMsg = '';
            this.updateFilterMsg();
        };
        Filter.prototype.checkAlreadyColFiltered = function (field) {
            var columns = this.filterSettings.columns;
            for (var _i = 0, columns_1 = columns; _i < columns_1.length; _i++) {
                var col = columns_1[_i];
                if (col.field === field && col.value === this.value &&
                    col.operator === this.operator && col.predicate === this.predicate) {
                    return true;
                }
            }
            return false;
        };
        Filter.prototype.columnMenuFilter = function (args) {
            this.column = args.col;
            var ele = ej2_base_1.closest(args.target, '#' + args.id);
            Iif (args.isClose && !ele) {
                this.filterModule.closeDialog();
            }
            else if (ele) {
                this.filterDialogOpen(this.column, args.target);
            }
        };
        Filter.prototype.filterDialogOpen = function (col, target, left, top) {
            var gObj = this.parent;
            if (this.filterModule) {
                this.filterModule.closeDialog();
            }
            this.filterModule = new this.type[col.filter.type || this.parent.filterSettings.type](this.parent, gObj.filterSettings, this.serviceLocator, this.customOperators, this);
            var dataSource = col.filter.dataSource || gObj.getDataModule().dataManager;
            this.filterModule.openDialog({
                type: col.type, field: col.field, displayName: col.headerText,
                dataSource: dataSource, format: col.format,
                filteredColumns: gObj.filterSettings.columns, target: target,
                sortedColumns: gObj.sortSettings.columns, formatFn: col.getFormatter(),
                parserFn: col.getParser(), query: gObj.query, template: col.getFilterItemTemplate(),
                hideSearchbox: ej2_base_1.isNullOrUndefined(col.filter.hideSearchbox) ? false : col.filter.hideSearchbox,
                handler: this.filterHandler.bind(this), localizedStrings: gObj.getLocaleConstants(),
                position: { X: left, Y: top }, column: col, foreignKeyValue: col.foreignKeyValue,
                actualPredicate: this.actualPredicate, localeObj: this.parent.localeObj
            });
        };
        Filter.prototype.removeFilteredColsByField = function (field, isClearFilterBar) {
            var fCell;
            var cols = this.filterSettings.columns;
            if (util_1.isActionPrevent(this.parent)) {
                var args = { instance: this, handler: this.removeFilteredColsByField, arg1: field, arg2: isClearFilterBar };
                this.parent.notify(events.preventBatch, args);
                return;
            }
            for (var i = 0, len = cols.length; i < len; i++) {
                var column = this.parent.getColumnByField(field) ||
                    util_1.getColumnByForeignKeyValue(field, this.parent.getForeignKeyColumns());
                Eif (cols[i].field === field || cols[i].field === column.foreignKeyValue) {
                    if (this.filterSettings.type === 'FilterBar' && !isClearFilterBar) {
                        var selector = '[id=\'' + cols[i].field + '_filterBarcell\']';
                        fCell = this.parent.getHeaderContent().querySelector(selector);
                        fCell.value = '';
                        delete this.values[field];
                    }
                    cols.splice(i, 1);
                    var fltrElement = this.parent.getColumnHeaderByField(column.field);
                    fltrElement.removeAttribute('aria-filtered');
                    if (this.filterSettings.type !== 'FilterBar') {
                        var iconClass = this.parent.showColumnMenu ? '.e-columnmenu' : '.e-icon-filter';
                        fltrElement.querySelector(iconClass).classList.remove('e-filtered');
                    }
                    this.isRemove = true;
                    Eif (this.actualPredicate[field]) {
                        delete this.actualPredicate[field];
                    }
                    if (this.values[field]) {
                        delete this.values[field];
                    }
                    this.parent.notify(events.modelChanged, {
                        requestType: 'filtering', type: events.actionBegin, currentFilterObject: {
                            field: column.field, operator: this.operator, value: this.value, predicate: this.predicate,
                            matchCase: this.matchCase, ignoreAccent: this.ignoreAccent, actualFilterValue: {}, actualOperator: {}
                        }, currentFilterColumn: column
                    });
                    break;
                }
            }
            this.updateFilterMsg();
        };
        Filter.prototype.getModuleName = function () {
            return 'filter';
        };
        Filter.prototype.keyUpHandler = function (e) {
            var gObj = this.parent;
            var target = e.target;
            if (target && ej2_base_2.matches(target, '.e-filterbar input')) {
                var closeHeaderEle = ej2_base_1.closest(target, 'th.e-filterbarcell');
                this.column = gObj.getColumnByUid(closeHeaderEle.getAttribute('e-mappinguid'));
                Iif (!this.column) {
                    return;
                }
                if ((this.filterSettings.mode === 'Immediate' || e.keyCode === 13) && e.keyCode !== 9) {
                    this.value = target.value.trim();
                    this.processFilter(e);
                }
            }
        };
        Filter.prototype.updateCrossIcon = function (element) {
            if (element.value.length) {
                element.nextElementSibling.classList.remove('e-hide');
            }
        };
        Filter.prototype.updateFilterMsg = function () {
            if (this.filterSettings.type === 'FilterBar') {
                var gObj = this.parent;
                var getFormatFlValue = void 0;
                var columns = this.filterSettings.columns;
                var formater = this.serviceLocator.getService('valueFormatter');
                var column = void 0;
                var value = void 0;
                if (!this.filterSettings.showFilterBarStatus) {
                    return;
                }
                if (columns.length > 0 && this.filterStatusMsg !== this.l10n.getConstant('InvalidFilterMessage')) {
                    this.filterStatusMsg = '';
                    for (var index = 0; index < columns.length; index++) {
                        column = gObj.getColumnByField(columns[index].field) ||
                            util_1.getColumnByForeignKeyValue(columns[index].field, this.parent.getForeignKeyColumns());
                        if (index) {
                            this.filterStatusMsg += ' && ';
                        }
                        if (!ej2_base_1.isNullOrUndefined(column.format)) {
                            var flValue = (column.type === 'date' || column.type === 'datetime') ?
                                new Date(this.values[column.field]) :
                                this.values[column.field];
                            if (!(column.type === 'date' || column.type === 'datetime')) {
                                var formater_1 = this.serviceLocator.getService('valueFormatter');
                                getFormatFlValue = formater_1.toView(flValue, column.getParser()).toString();
                            }
                            else {
                                getFormatFlValue = this.setFormatForFlColumn(flValue, column);
                            }
                            this.filterStatusMsg += column.headerText + ': ' + getFormatFlValue;
                        }
                        else {
                            this.filterStatusMsg += column.headerText + ': ' + this.values[column.field];
                        }
                    }
                }
                if (gObj.allowPaging) {
                    gObj.updateExternalMessage(this.filterStatusMsg);
                }
                this.filterStatusMsg = '';
            }
        };
        Filter.prototype.setFormatForFlColumn = function (value, column) {
            var formater = this.serviceLocator.getService('valueFormatter');
            return formater.toView(value, column.getFormatter()).toString();
        };
        Filter.prototype.checkForSkipInput = function (column, value) {
            var isSkip;
            var skipInput;
            if (column.type === 'number') {
                skipInput = ['=', ' ', '!'];
                Iif (ej2_data_1.DataUtil.operatorSymbols[value] || skipInput.indexOf(value) > -1) {
                    isSkip = true;
                }
            }
            else if (column.type === 'string') {
                skipInput = ['>', '<', '=', '!'];
                for (var _i = 0, value_1 = value; _i < value_1.length; _i++) {
                    var val = value_1[_i];
                    Iif (skipInput.indexOf(val) > -1) {
                        isSkip = true;
                    }
                }
            }
            return isSkip;
        };
        Filter.prototype.processFilter = function (e) {
            this.stopTimer();
            this.startTimer(e);
        };
        Filter.prototype.startTimer = function (e) {
            var _this = this;
            this.timer = window.setInterval(function () { _this.onTimerTick(); }, e.keyCode === 13 ? 0 : this.filterSettings.immediateModeDelay);
        };
        Filter.prototype.stopTimer = function () {
            window.clearInterval(this.timer);
        };
        Filter.prototype.onTimerTick = function () {
            var selector = '[id=\'' + this.column.field + '_filterBarcell\']';
            var filterElement = this.element.querySelector(selector);
            if (!filterElement && this.parent.getFrozenColumns()) {
                filterElement = this.parent.getHeaderContent().querySelector(selector);
            }
            var filterValue;
            this.stopTimer();
            Iif (!ej2_base_1.isNullOrUndefined(this.column.filterBarTemplate)) {
                var templateRead = this.column.filterBarTemplate.read;
                if (typeof templateRead === 'string') {
                    templateRead = ej2_base_1.getValue(templateRead, window);
                }
                if (!ej2_base_1.isNullOrUndefined(templateRead)) {
                    this.value = templateRead.call(this, filterElement);
                }
            }
            else {
                filterValue = JSON.parse(JSON.stringify(filterElement.value));
            }
            if (ej2_base_1.isNullOrUndefined(this.value) || this.value === '') {
                this.removeFilteredColsByField(this.column.field);
                return;
            }
            this.validateFilterValue(this.value);
            this.filterByColumn(this.column.field, this.operator, this.value, this.predicate, this.matchCase, this.ignoreAccent);
            filterElement.value = filterValue;
            this.updateFilterMsg();
        };
        Filter.prototype.validateFilterValue = function (value) {
            var gObj = this.parent;
            var skipInput;
            var index;
            this.matchCase = true;
            switch (this.column.type) {
                case 'number':
                    this.operator = this.filterOperators.equal;
                    skipInput = ['>', '<', '=', '!'];
                    for (var i = 0; i < value.length; i++) {
                        if (skipInput.indexOf(value[i]) > -1) {
                            index = i;
                            break;
                        }
                    }
                    this.getOperator(value.substring(index));
                    if (index !== 0) {
                        this.value = value.substring(0, index);
                    }
                    Eif (this.value !== '' && value.length >= 1) {
                        this.value = this.valueFormatter.fromView(this.value, this.column.getParser(), this.column.type);
                    }
                    if (isNaN(this.value)) {
                        this.filterStatusMsg = this.l10n.getConstant('InvalidFilterMessage');
                    }
                    break;
                case 'date':
                case 'datetime':
                    this.operator = this.filterOperators.equal;
                    Eif (this.value !== '' && !(this.value instanceof Date)) {
                        this.getOperator(value);
                        this.value = this.valueFormatter.fromView(this.value, this.column.getParser(), this.column.type);
                        Iif (ej2_base_1.isNullOrUndefined(this.value)) {
                            this.filterStatusMsg = this.l10n.getConstant('InvalidFilterMessage');
                        }
                    }
                    break;
                case 'string':
                    this.matchCase = false;
                    if (value.charAt(0) === '*') {
                        this.value = this.value.slice(1);
                        this.operator = this.filterOperators.startsWith;
                    }
                    else if (value.charAt(value.length - 1) === '%') {
                        this.value = this.value.slice(0, -1);
                        this.operator = this.filterOperators.startsWith;
                    }
                    else if (value.charAt(0) === '%') {
                        this.value = this.value.slice(1);
                        this.operator = this.filterOperators.endsWith;
                    }
                    else {
                        this.operator = this.filterOperators.startsWith;
                    }
                    break;
                case 'boolean':
                    if (value.toLowerCase() === 'true' || value === '1') {
                        this.value = true;
                    }
                    else if (value.toLowerCase() === 'false' || value === '0') {
                        this.value = false;
                    }
                    else Eif (value.length) {
                        this.filterStatusMsg = this.l10n.getConstant('InvalidFilterMessage');
                    }
                    this.operator = this.filterOperators.equal;
                    break;
                default:
                    this.operator = this.filterOperators.equal;
            }
        };
        Filter.prototype.getOperator = function (value) {
            var singleOp = value.charAt(0);
            var multipleOp = value.slice(0, 2);
            var operators = ej2_base_1.extend({ '=': this.filterOperators.equal, '!': this.filterOperators.notEqual }, ej2_data_1.DataUtil.operatorSymbols);
            if (operators.hasOwnProperty(singleOp) || operators.hasOwnProperty(multipleOp)) {
                this.operator = operators[singleOp];
                this.value = value.substring(1);
                Iif (!this.operator) {
                    this.operator = operators[multipleOp];
                    this.value = value.substring(2);
                }
            }
            if (this.operator === this.filterOperators.lessThan || this.operator === this.filterOperators.greaterThan) {
                if (this.value.charAt(0) === '=') {
                    this.operator = this.operator + 'orequal';
                    this.value = this.value.substring(1);
                }
            }
        };
        Filter.prototype.columnPositionChanged = function (e) {
            if (this.parent.filterSettings.type !== 'FilterBar') {
                return;
            }
        };
        Filter.prototype.getLocalizedCustomOperators = function () {
            var numOptr = [
                { value: 'equal', text: this.l10n.getConstant('Equal') },
                { value: 'greaterthan', text: this.l10n.getConstant('GreaterThan') },
                { value: 'greaterthanorequal', text: this.l10n.getConstant('GreaterThanOrEqual') },
                { value: 'lessthan', text: this.l10n.getConstant('LessThan') },
                { value: 'lessthanorequal', text: this.l10n.getConstant('LessThanOrEqual') },
                { value: 'notequal', text: this.l10n.getConstant('NotEqual') }
            ];
            this.customOperators = {
                stringOperator: [
                    { value: 'startswith', text: this.l10n.getConstant('StartsWith') },
                    { value: 'endswith', text: this.l10n.getConstant('EndsWith') },
                    { value: 'contains', text: this.l10n.getConstant('Contains') },
                    { value: 'equal', text: this.l10n.getConstant('Equal') },
                    { value: 'notequal', text: this.l10n.getConstant('NotEqual') }
                ],
                numberOperator: numOptr,
                dateOperator: numOptr,
                datetimeOperator: numOptr,
                booleanOperator: [
                    { value: 'equal', text: this.l10n.getConstant('Equal') },
                    { value: 'notequal', text: this.l10n.getConstant('NotEqual') }
                ]
            };
        };
        ;
        Filter.prototype.filterIconClickHandler = function (e) {
            var target = e.target;
            if (target.classList.contains('e-filtermenudiv') && (this.parent.filterSettings.type === 'Menu' ||
                this.parent.filterSettings.type === 'CheckBox' || this.parent.filterSettings.type === 'Excel')) {
                var gObj = this.parent;
                var col = gObj.getColumnByUid(util_2.parentsUntil(target, 'e-headercell').firstElementChild.getAttribute('e-mappinguid'));
                var gClient = gObj.element.getBoundingClientRect();
                var fClient = target.getBoundingClientRect();
                this.column = col;
                Iif (this.fltrDlgDetails.field === col.field && this.fltrDlgDetails.isOpen) {
                    return;
                }
                if (this.filterModule) {
                    this.filterModule.closeDialog();
                }
                this.fltrDlgDetails = { field: col.field, isOpen: true };
                this.filterDialogOpen(this.column, target, fClient.right - gClient.left, fClient.bottom - gClient.top);
            }
        };
        Filter.prototype.clickHandler = function (e) {
            if (this.filterSettings.mode === 'Immediate' || this.parent.filterSettings.type === 'Menu' ||
                this.parent.filterSettings.type === 'CheckBox' || this.parent.filterSettings.type === 'Excel') {
                var gObj = this.parent;
                var target = e.target;
                var datepickerEle = target.classList.contains('e-day');
                if (util_2.parentsUntil(target, 'e-filter-popup') || target.classList.contains('e-filtermenudiv')) {
                    return;
                }
                else if (this.filterModule &&
                    (!util_2.parentsUntil(target, 'e-popup-wrapper')
                        && (!ej2_base_1.closest(target, '.e-filter-item.e-menu-item'))
                        && (!util_2.parentsUntil(target, 'e-popup'))) && !datepickerEle) {
                    this.filterModule.closeDialog(target);
                }
                Iif (this.filterSettings.mode === 'Immediate' && target.classList.contains('e-clear-icon')) {
                    var targetText = target.previousElementSibling;
                    this.removeFilteredColsByField(targetText.id.slice(0, -14));
                }
            }
        };
        Filter.prototype.filterHandler = function (args) {
            var filterIconElement;
            this.actualPredicate[args.field] = args.actualPredicate;
            var dataManager = new ej2_data_1.DataManager(this.filterSettings.columns);
            var query = new ej2_data_1.Query().where('field', this.filterOperators.equal, args.field);
            var result = dataManager.executeLocal(query);
            for (var i = 0; i < result.length; i++) {
                var index = -1;
                for (var j = 0; j < this.filterSettings.columns.length; j++) {
                    if (result[i].field === this.filterSettings.columns[j].field) {
                        index = j;
                        break;
                    }
                }
                Eif (index !== -1) {
                    this.filterSettings.columns.splice(index, 1);
                }
            }
            if (this.values[args.field]) {
                delete this.values[args.field];
            }
            var iconClass = this.parent.showColumnMenu ? '.e-columnmenu' : '.e-icon-filter';
            filterIconElement = this.parent.getColumnHeaderByField(args.field).querySelector(iconClass);
            if (args.action === 'filtering') {
                this.filterSettings.columns = this.filterSettings.columns.concat(args.filterCollection);
                Eif (this.filterSettings.columns.length && filterIconElement) {
                    filterIconElement.classList.add('e-filtered');
                }
            }
            else {
                Eif (filterIconElement) {
                    filterIconElement.classList.remove('e-filtered');
                }
                this.parent.renderModule.refresh();
            }
            this.parent.dataBind();
        };
        Filter.prototype.updateFilter = function () {
            var cols = this.filterSettings.columns;
            for (var i = 0; i < cols.length; i++) {
                this.column = this.parent.getColumnByField(cols[i].field) ||
                    util_1.getColumnByForeignKeyValue(cols[i].field, this.parent.getForeignKeyColumns());
                var fieldName = cols[i].field;
                if (!this.parent.getColumnByField(cols[i].field)) {
                    fieldName = util_1.getColumnByForeignKeyValue(cols[i].field, this.parent.getForeignKeyColumns()).field;
                }
                this.refreshFilterIcon(fieldName, cols[i].operator, cols[i].value, cols[i].type, cols[i].predicate, cols[i].matchCase, cols[i].ignoreAccent);
            }
        };
        Filter.prototype.refreshFilterIcon = function (fieldName, operator, value, type, predicate, matchCase, ignoreAccent) {
            this.actualPredicate[fieldName] = [{
                    field: fieldName,
                    predicate: predicate,
                    matchCase: matchCase,
                    ignoreAccent: ignoreAccent,
                    operator: operator,
                    value: value,
                    type: type
                }];
            this.addFilteredClass(fieldName);
        };
        Filter.prototype.addFilteredClass = function (fieldName) {
            var filterIconElement;
            filterIconElement = this.parent.getColumnHeaderByField(fieldName).querySelector('.e-icon-filter');
            if (filterIconElement) {
                filterIconElement.classList.add('e-filtered');
            }
        };
        return Filter;
    }());
    exports.Filter = Filter;
});