all files / grid/actions/ filter.js

94.3% Statements 745/790
86% Branches 565/657
98.67% Functions 74/75
94.26% Lines 739/784
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 809 810 811 812 813 814 815 816 817 818 819 820 821 822 823 824 825 826 827 828 829 830 831 832 833 834 835 836 837 838 839 840 841 842 843 844 845 846 847 848 849 850 851 852 853 854 855 856 857 858 859 860 861 862 863 864 865 866 867 868 869 870 871 872 873 874 875 876 877 878 879 880 881 882 883 884 885 886 887 888 889 890 891 892 893 894 895 896 897 898 899 900 901 902 903 904 905 906 907 908 909 910 911 912 913 914 915 916 917 918 919 920 921 922 923 924 925 926 927 928 929 930 931 932 933 934 935 936 937 938 939 940 941 942 943 944 945 946 947 948 949 950 951 952 953 954 955 956 957 958 959 960 961 962 963 964 965 966 967 968 969 970 971 972 973 974 975 976 977 978 979 980 981 982 983 984 985 986 987 988 989 990 991 992 993 994 995 996 997 998 999 1000 1001 1002 1003 1004 1005 1006 1007 1008 1009 1010 1011 1012 1013 1014 1015 1016 1017 1018 1019 1020 1021 1022 1023 1024 1025 1026 1027 1028 1029 1030 1031 1032 1033 1034 1035 1036 1037 1038 1039 1040 1041 1042 1043 1044 1045 1046 1047 1048 1049 1050 1051 1052 1053 1054 1055 1056 1057 1058 1059 1060 1061 1062 1063 1064 1065 1066 1067 1068 1069 1070 1071 1072 1073 1074 1075 1076 1077 1078 1079 1080 1081 1082 1083 1084 1085 1086 1087 1088 1089 1090 1091 1092 1093 1094 1095 1096 1097 1098 1099 1100 1101 1102 1103 1104 1105 1106 1107 1108 1109 1110 1111 1112 1113 1114 1115 1116 1117 1118 1119 1120 1121 1122 1123 1124 1125 1126 1127 1128 1129 1130 1131 1132 1133 1134 1135 1136 1137 1138 1139 1140 1141 1142 1143 1144 1145 1146 1147 1148 1149 1150 1151 1152 1153 1154 1155 1156 1157 1158 1159 1160 1161 1162 1163 1164 1165 1166 1167 1168 1169 1170 1171 1172 1173 1174 1175 1176 1177 1178 1179 1180 1181 1182 1183 1184 1185 1186 1187 1188 1189 1190 1191 1192 1193 1194 1195 1196 1197 1198 1199 1200 1201 1202 1203 1204 1205 1206 1207 1208 1209 1210 1211 1212 1213 1214 1215 1216 1217 1218 1219 1220 1221 1222 1223 1224 1225 1226 1227 1228 1229 1230 1231 1232 1233 1234 1235 1236 1237 1238 1239 1240 1241 1242 1243 1244 1245 1246 1247 1248   286× 286× 286× 286× 286× 286× 286× 286× 286× 286×         286× 286× 286× 286× 286× 286× 286× 286× 286× 286×   404×   403× 403× 403× 403× 247× 246× 246×   246× 246× 246× 246× 246× 246× 246× 246× 246× 246× 246×       246× 246× 246× 32×   246× 13× 10×         246× 246× 50×   246× 246×         13×   210× 210×   534× 534×   532× 179×   532× 275×   532× 532× 532× 531× 133× 26× 26×       133× 1259×         531× 136× 134× 1639× 1639×   134× 134× 134×   136× 136×         289× 288×     246× 246× 246× 246×   246× 246× 159× 69×     246× 32×   246× 12×   246× 2008× 2008×   246×   246×   2122×               2122×   126×   126× 126× 126× 126× 126× 136× 136× 136×         136× 136× 13×     123×   136×                                   126× 126×   328× 328× 131×   102×     226×   199×             199× 199×   246×   532×   17×     286× 286×   286×   15×     278× 278× 19× 19× 19× 19× 26× 26×   19× 19× 19×     287×   286× 286× 286× 286× 286× 286× 286× 286× 286× 286× 286× 286× 286× 286× 286× 286× 286× 286× 286× 286×   532× 532× 532× 272×   260× 260× 260× 260× 260× 260× 260× 260× 260× 260× 260× 260× 260×                     206×   154× 154× 154× 154× 83×   154× 154×     154×   154×   153× 81×   153×   151×         147× 147× 147× 147× 147× 147× 147× 147×   147× 53×   147× 74×           74× 48×     147× 14× 14×         133×   147×                 147× 75×   147×     143×   147× 21×   126×   21× 21×   21×           19×     217× 217× 217× 404× 404× 58×     217×   538× 305×   233× 236× 236×   222× 222×         222× 177× 177×                                 176× 176× 176× 176×   221×             12× 12× 12×   12×       191× 76× 78× 78× 78× 78×     71× 71×   78× 78× 78×   40×     38×       76× 26× 26×           176×       106× 106× 106× 106×   106×     52× 52× 52×   51×   49× 60×     60× 60× 49× 49× 50×   49× 49× 47×   49×           49× 49× 49×   147× 147× 62× 62×         62×   21×     126×                   12× 12× 12×     12×     201× 119× 119×   201× 201×   210× 210×   210× 210×                                   210×   69× 69× 69×   82× 82× 67× 66×   66× 66×   67× 65×   65× 65× 65× 64× 82×   64× 40× 40× 40× 40× 40×     64× 82× 74×     64× 64× 25× 25×   64× 64× 60×   64× 23×   64× 14×         64×     67× 67× 65× 65× 64×   67×   21092×       91× 91× 91× 45× 45× 45×     45×   45×     43× 43×     91×       91×         885× 471× 471× 471× 471× 471×   463× 132× 132× 144×     144× 12×   144× 12×     12×       12×     132×       463× 140× 140×     463×     29× 29×   39× 39× 15×       24× 18× 85× 85×         39×   43× 43×   43× 43×   84×   41× 41× 41×     41× 41× 41× 41×                   41×   41×   39× 39× 39× 39× 39× 39×   39× 39× 39× 39×   15×     14×   15× 15× 40×     15× 15×   15× 14×   15×   15×             18× 18×     16×   15×     13×     18×                           16× 16× 16× 16×         16×       14×     403×                   403×                                               196× 196×   195× 195× 195× 195×     195× 195× 195×   398× 398×   196× 196× 196× 196×   195× 119×   195× 195×     11911×                           11911×   658× 658× 658× 658× 658× 658×     658×     658×     658× 219×   439×     71×               73× 73× 73× 73× 73× 73× 73× 54× 54× 92×   54× 54×     54× 54×     73×   73× 73× 73× 73× 52× 52× 52×       21× 21×   21× 21×   73×   176× 176× 176× 345×   345× 345× 13×   345×     345×                 345× 135×     210×   345× 345×   345× 345× 345×   339× 339×   345× 271×                
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", "../base/string-literals", "@syncfusion/ej2-inputs"], 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, literals, ej2_inputs_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var Filter = (function () {
        function Filter(parent, filterSettings, serviceLocator) {
            this.predicate = 'and';
            this.contentRefresh = true;
            this.filterByMethod = true;
            this.refresh = true;
            this.values = {};
            this.operators = {};
            this.cellText = {};
            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', wildCard: 'wildcard',
                isNull: 'isnull', notNull: 'notnull', like: 'like'
            };
            this.fltrDlgDetails = { field: '', isOpen: false };
            this.skipNumberInput = ['=', ' ', '!'];
            this.skipStringInput = ['>', '<', '='];
            this.actualPredicate = {};
            this.inputList = [];
            this.parent = parent;
            this.filterSettings = filterSettings;
            this.serviceLocator = serviceLocator;
            this.addEventListener();
            this.setFullScreenDialog();
        }
        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') {
                if (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 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 = this.parent.createElement('tr', { className: 'e-filterbar', attrs: { role: 'row' } });
                    var row = this.generateRow();
                    row.data = this.values;
                    this.parent.getHeaderContent().querySelector('thead:not(.e-masked-thead)').appendChild(rowRenderer.element);
                    var rowdrag = this.parent.element.querySelector('.e-rowdragheader');
                    this.element = rowRenderer.render(row, gObj.getColumns(), null, null, rowRenderer.element);
                    if (this.element.querySelectorAll('.e-leftfreeze').length &&
                        (this.element.querySelectorAll('.e-indentcell').length || this.element.querySelectorAll('.e-grouptopleftcell').length)) {
                        var td = this.element.querySelectorAll('.e-indentcell, .e-grouptopleftcell');
                        for (var i = 0; i < td.length; i++) {
                            td[parseInt(i.toString(), 10)].classList.add('e-leftfreeze');
                            util_2.applyStickyLeftRightPosition(td[parseInt(i.toString(), 10)], i * 30, this.parent.enableRtl, 'Left');
                        }
                    }
                    util_2.addFixedColumnBorder(this.element);
                    var detail = this.element.querySelector('.e-detailheadercell');
                    if (detail) {
                        detail.className = 'e-filterbarcell e-mastercell';
                    }
                    if (rowdrag) {
                        if (rowdrag.classList.contains('e-leftfreeze')) {
                            rowdrag.className = 'e-dragheadercell e-mastercell e-leftfreeze';
                        }
                        else {
                            rowdrag.className = 'e-filterbarcell e-mastercell';
                        }
                    }
                    var gCells = [].slice.call(this.element.getElementsByClassName('e-grouptopleftcell'));
                    if (gCells.length) {
                        gCells[gCells.length - 1].classList.add('e-lastgrouptopleftcell');
                    }
                    this.wireEvents();
                    this.parent.notify(events.freezeRender, { case: 'filter' });
                }
            }
        };
        Filter.prototype.showCustomFilter = function (enable) {
            this.responsiveDialogRenderer.isCustomDialog = enable;
            this.responsiveDialogRenderer.showResponsiveDialog(this.column);
        };
        Filter.prototype.renderResponsiveChangeAction = function (args) {
            this.responsiveDialogRenderer.action = args.action;
        };
        Filter.prototype.setFilterModel = function (col) {
            var type = col.filter.type || this.parent.filterSettings.type;
            this.filterModule = new this.type["" + type](this.parent, this.parent.filterSettings, this.serviceLocator, this.customOperators, this);
        };
        Filter.prototype.destroy = function () {
            var gridElement = this.parent.element;
            if (!gridElement || (!gridElement.querySelector('.' + literals.gridHeader) && !gridElement.querySelector('.' + literals.gridContent))) {
                return;
            }
            if (this.filterModule) {
                this.filterModule.destroy();
            }
            if (!this.parent.refreshing && (this.parent.isDestroyed || !this.parent.allowFiltering)) {
                this.filterSettings.columns = [];
            }
            this.updateFilterMsg();
            this.removeEventListener();
            this.unWireEvents();
            if (this.filterSettings.type === 'FilterBar' && !this.parent.isDestroyed) {
                if (this.filterSettings.showFilterBarOperator) {
                    var dropdownlist = [].slice.call(this.element.getElementsByClassName('e-filterbaroperator'));
                    for (var i = 0; i < dropdownlist.length; i++) {
                        Eif (dropdownlist[parseInt(i.toString(), 10)].ej2_instances[0]) {
                            dropdownlist[parseInt(i.toString(), 10)].ej2_instances[0].destroy();
                        }
                    }
                }
                this.parent.getColumns().map(function (column) {
                    if (column.filterBarTemplate && !ej2_base_1.isNullOrUndefined(column.filterBarTemplate.destroy)) {
                        var destroyFn = column.filterBarTemplate.destroy;
                        if (typeof destroyFn === 'string') {
                            destroyFn = ej2_base_1.getValue(destroyFn, window);
                        }
                        destroyFn();
                    }
                });
            }
            if (this.element) {
                if (this.element.parentElement) {
                    for (var i = 0; i < this.inputList.length; i++) {
                        ej2_inputs_1.Input.destroy(this.inputList[parseInt(i.toString(), 10)], this.inputList[parseInt(i.toString(), 10)].element.nextElementSibling);
                        ej2_base_2.remove(this.inputList[parseInt(i.toString(), 10)].element);
                    }
                    this.inputList = [];
                    ej2_base_2.remove(this.element);
                    this.element = null;
                }
                var filterBarElement = this.parent.getHeaderContent().querySelector('.e-filterbar');
                Iif (filterBarElement) {
                    ej2_base_2.remove(filterBarElement);
                }
            }
        };
        Filter.prototype.setFullScreenDialog = function () {
            if (this.serviceLocator) {
                this.serviceLocator.registerAdaptiveService(this, this.parent.enableAdaptiveUI, enum_1.ResponsiveDialogAction.isFilter);
            }
        };
        Filter.prototype.generateRow = function () {
            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));
            }
            if (this.parent.isRowDragable() && this.parent.getFrozenMode() !== 'Right') {
                cells.push(this.generateCell({}, enum_1.CellType.RowDragHIcon));
            }
            for (var _i = 0, _a = this.parent.getColumns(); _i < _a.length; _i++) {
                var dummy = _a[_i];
                cells.push(this.generateCell(dummy));
            }
            if (this.parent.isRowDragable() && this.parent.getFrozenMode() === 'Right') {
                cells.push(this.generateCell({}, enum_1.CellType.RowDragHIcon));
            }
            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.column.isForeignColumn() ? this.parent.getColumnByUid(this.column.uid) :
                this.parent.getColumnByField(this.fieldName);
            this.filterObjIndex = this.getFilteredColsIndexByField(col);
            this.prevFilterObject = this.filterSettings.columns[this.filterObjIndex];
            var arrayVal = Array.isArray(this.value) ? this.value : [this.value];
            var moduleName = this.parent.dataSource.adaptor && this.parent.dataSource.adaptor.getModuleName ? this.parent.dataSource.adaptor.getModuleName() : undefined;
            for (var i = 0, len = arrayVal.length; i < len; i++) {
                var field = col.isForeignColumn() ? col.foreignKeyValue : this.fieldName;
                var isMenuNotEqual = this.operator === 'notequal';
                this.currentFilterObject = {
                    field: field, uid: col.uid, isForeignKey: col.isForeignColumn(), operator: this.operator,
                    value: arrayVal[parseInt(i.toString(), 10)], predicate: this.predicate,
                    matchCase: this.matchCase, ignoreAccent: this.ignoreAccent, actualFilterValue: {}, actualOperator: {}
                };
                var index = this.getFilteredColsIndexByField(col);
                if (index > -1 && !Array.isArray(this.value)) {
                    this.filterSettings.columns[parseInt(index.toString(), 10)] = this.currentFilterObject;
                }
                else {
                    this.filterSettings.columns.push(this.currentFilterObject);
                }
                if (!this.column.isForeignColumn() && ej2_base_1.isNullOrUndefined(this.value) && (this.operator === 'equal' ||
                    this.operator === 'notequal') && (moduleName !== 'ODataAdaptor' && moduleName !== 'ODataV4Adaptor')) {
                    for (var i_1 = 0; i_1 < this.filterSettings.columns.length; i_1++) {
                        if (this.filterSettings.columns["" + i_1].field === field &&
                            (this.filterSettings.columns["" + i_1].operator === 'equal' || this.filterSettings.columns["" + i_1].operator === 'notequal')
                            && ej2_base_1.isNullOrUndefined(this.filterSettings.columns["" + i_1].value)) {
                            this.filterSettings.columns.splice(i_1, 1);
                            i_1 = i_1 - 1;
                        }
                    }
                    if (col.type === 'string') {
                        this.filterSettings.columns.push({
                            field: field, ignoreAccent: this.ignoreAccent, matchCase: this.matchCase,
                            operator: this.operator, predicate: isMenuNotEqual ? 'and' : 'or', value: ''
                        });
                    }
                    this.filterSettings.columns.push({
                        field: field, ignoreAccent: this.ignoreAccent, matchCase: this.matchCase,
                        operator: this.operator, predicate: isMenuNotEqual ? 'and' : 'or', value: undefined
                    });
                    this.filterSettings.columns.push({
                        field: field, ignoreAccent: this.ignoreAccent, matchCase: this.matchCase,
                        operator: this.operator, predicate: isMenuNotEqual ? 'and' : 'or', value: null
                    });
                }
            }
            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[parseInt(i.toString(), 10)].uid === col.uid || (col.isForeignColumn()
                    && this.parent.getColumnByUid(col.uid).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.keyUpHandlerImmediate, this);
        };
        Filter.prototype.unWireEvents = function () {
            ej2_base_1.EventHandler.remove(this.parent.getHeaderContent(), 'keyup', this.keyUpHandlerImmediate);
        };
        Filter.prototype.enableAfterRender = function (e) {
            if (e.module === this.getModuleName() && e.enable) {
                this.parent.getHeaderTable().classList.add('e-sortfilter');
                this.render();
            }
        };
        Filter.prototype.refreshFilterValue = function () {
            Eif (!ej2_base_1.isNullOrUndefined(this.parent.modelObserver.boundedEvents)) {
                this.parent.removeEventListener(events.beforeDataBound, this.refreshFilterValueFn);
            }
            if ((this.filterSettings.type === 'FilterBar' || this.filterSettings.type === 'Excel') && this.filterSettings.columns.length &&
                !this.parent.getCurrentViewRecords().length) {
                this.initialEnd();
            }
        };
        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;
                this.initialLoad = true;
                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, col.isForeignKey);
                }
                this.initialLoad = false;
                this.updateFilterMsg();
                this.contentRefresh = true;
            }
        };
        Filter.prototype.addEventListener = function () {
            if (this.parent.isDestroyed) {
                return;
            }
            this.parent.on(events.setFullScreenDialog, this.setFullScreenDialog, this);
            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);
            this.parent.on(events.renderResponsiveChangeAction, this.renderResponsiveChangeAction, this);
            this.docClickHandler = this.clickHandler.bind(this);
            ej2_base_1.EventHandler.add(document, 'click', this.docClickHandler, this);
            ej2_base_1.EventHandler.add(this.parent.element, 'mousedown', this.refreshClearIcon, this);
            this.parent.on(events.filterOpen, this.columnMenuFilter, this);
            this.parent.on(events.click, this.filterIconClickHandler, this);
            this.parent.on('persist-data-changed', this.initialEnd, this);
            this.parent.on(events.closeFilterDialog, this.clickHandler, this);
            this.parent.on(events.destroy, this.destroy, this);
            this.refreshFilterValueFn = this.refreshFilterValue.bind(this);
            this.parent.addEventListener(events.beforeDataBound, this.refreshFilterValueFn);
        };
        Filter.prototype.removeEventListener = function () {
            ej2_base_1.EventHandler.remove(document, 'click', this.docClickHandler);
            ej2_base_1.EventHandler.remove(this.parent.element, 'mousedown', this.refreshClearIcon);
            if (this.parent.isDestroyed) {
                return;
            }
            this.parent.off(events.setFullScreenDialog, this.setFullScreenDialog);
            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.renderResponsiveChangeAction, this.renderResponsiveChangeAction);
            this.parent.off(events.click, this.filterIconClickHandler);
            this.parent.off(events.closeFilterDialog, this.clickHandler);
            this.parent.off(events.destroy, this.destroy);
        };
        Filter.prototype.refreshClearIcon = function (e) {
            Iif (this.parent.allowFiltering && this.parent.filterSettings.type === 'FilterBar' &&
                e.target.closest('th') && e.target.closest('th').classList.contains('e-filterbarcell') &&
                e.target.classList.contains('e-clear-icon')) {
                var targetText = e.target.previousElementSibling;
                ej2_inputs_1.Input.setValue(null, targetText, 'Never', true);
                if (this.filterSettings.mode === 'Immediate') {
                    this.removeFilteredColsByField(targetText.id.slice(0, -14));
                }
            }
        };
        Filter.prototype.filterMenuClose = function () {
            this.fltrDlgDetails.isOpen = false;
        };
        Filter.prototype.filterByColumn = function (fieldName, filterOperator, filterValue, predicate, matchCase, ignoreAccent, actualFilterValue, actualOperator, isForeignColumn) {
            var _this = this;
            var gObj = this.parent;
            var filterCell;
            if (typeof filterValue === 'string') {
                filterValue = this.parent.sanitize(filterValue);
            }
            this.column = gObj.grabColumnByFieldFromAllCols(fieldName, isForeignColumn);
            if (this.filterSettings.type === 'FilterBar' && this.filterSettings.showFilterBarOperator
                && ej2_base_1.isNullOrUndefined(this.column.filterBarTemplate) && ej2_base_1.isNullOrUndefined(this.column.filterTemplate)) {
                filterOperator = this.getOperatorName(fieldName);
            }
            if (filterOperator === 'like' && filterValue && filterValue.indexOf('%') === -1) {
                filterValue = '%' + filterValue + '%';
            }
            if (!this.column) {
                return;
            }
            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) {
                this.parent.log('action_disabled_column', { moduleName: this.getModuleName(), columnName: this.column.headerText });
                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.predicate = predicate ? predicate : Array.isArray(filterValue) ? 'or' : 'and';
            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.operator = filterOperator;
            filterValue = !ej2_base_1.isNullOrUndefined(filterValue) ? filterValue.toString() : filterValue;
            if (filterValue === '') {
                filterValue = null;
            }
            if (this.column.type === 'number' || this.column.type === 'date') {
                this.matchCase = true;
            }
            if (filterCell && this.filterSettings.type === 'FilterBar') {
                Iif ((filterValue && filterValue.length < 1) || (!this.filterByMethod &&
                    this.checkForSkipInput(this.column, filterValue))) {
                    this.filterStatusMsg = (filterValue && filterValue.length < 1) ? '' : this.l10n.getConstant('InvalidFilterMessage');
                    this.updateFilterMsg();
                    return;
                }
                if (filterCell.value !== filterValue) {
                    filterCell.value = filterValue;
                }
            }
            if (!ej2_base_1.isNullOrUndefined(this.column.format)) {
                this.applyColumnFormat(filterValue);
                Iif (this.initialLoad && this.filterSettings.type === 'FilterBar') {
                    filterCell.value = this.values[this.column.field];
                }
            }
            else {
                this.values[this.column.field] = filterValue;
            }
            var predObj = {
                field: this.fieldName,
                predicate: predicate,
                matchCase: matchCase,
                ignoreAccent: ignoreAccent,
                operator: this.operator,
                value: this.value,
                type: this.column.type
            };
            var filterColumn = this.parent.filterSettings.columns.filter(function (fColumn) {
                return (fColumn.field === _this.fieldName);
            });
            if (filterColumn.length > 1 && !ej2_base_1.isNullOrUndefined(this.actualPredicate[this.fieldName])) {
                this.actualPredicate[this.fieldName].push(predObj);
            }
            else {
                this.actualPredicate[this.fieldName] = [predObj];
            }
            if (this.checkAlreadyColFiltered(this.column.field)) {
                return;
            }
            this.updateModel();
        };
        Filter.prototype.applyColumnFormat = function (filterValue) {
            var _this = this;
            var getFlvalue = (this.column.type === 'date' || this.column.type === 'datetime' || this.column.type === 'dateonly') ?
                new Date(filterValue) : parseFloat(filterValue);
            if ((this.column.type === 'date' || this.column.type === 'datetime' || this.column.type === 'dateonly') && filterValue &&
                Array.isArray(this.value) && filterValue.split(',').length > 1) {
                this.values[this.column.field] = ((filterValue).split(',')).map(function (val) {
                    if (val === '') {
                        val = null;
                    }
                    return _this.setFormatForFlColumn(new Date(val), _this.column);
                });
            }
            else {
                this.values[this.column.field] = this.setFormatForFlColumn(getFlvalue, this.column);
            }
        };
        Filter.prototype.skipUid = function (col) {
            var flag = true;
            var colLen = Object.keys((col));
            for (var i = 0; i < colLen.length; i++) {
                var key = Object.keys(col[colLen[parseInt(i.toString(), 10)]]);
                if (key.length === 1 && key[0] === 'uid') {
                    flag = false;
                }
            }
            return flag;
        };
        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':
                        var col = 'columns';
                        var args = {
                            currentFilterObject: this.currentFilterObject, currentFilteringColumn: this.column ?
                                this.column.field : undefined, action: 'filter', columns: this.filterSettings.columns,
                            requestType: 'filtering', type: events.actionBegin, cancel: false
                        };
                        if (this.contentRefresh && this.skipUid(e.properties["" + col])) {
                            this.parent.notify(events.modelChanged, args);
                            if (args.cancel) {
                                Eif ((this.filterSettings.type === 'CheckBox' || this.filterSettings.type === 'Excel')) {
                                    this.filterSettings.columns = (this.actualData.length <= 1) ? this.checkboxPrevFilterObject :
                                        this.checkboxFilterObject;
                                    this.actualPredicate[this.column.field] = this.filterSettings.columns;
                                    var col_1 = this.parent.getColumnByField(this.column.field);
                                    var iconClass = this.parent.showColumnMenu && col_1.showColumnMenu ? '.e-columnmenu' : '.e-icon-filter';
                                    var filterIconElement = this.parent.getColumnHeaderByField(this.column.field)
                                        .querySelector(iconClass);
                                    Eif (this.checkboxPrevFilterObject.length === 0) {
                                        filterIconElement.classList.remove('e-filtered');
                                    }
                                    else {
                                        filterIconElement.classList.add('e-filtered');
                                    }
                                }
                                else {
                                    if (ej2_base_1.isNullOrUndefined(this.prevFilterObject)) {
                                        this.filterSettings.columns.splice(this.filterSettings.columns.length - 1, 1);
                                    }
                                    else {
                                        this.filterSettings.columns[this.filterObjIndex] = this.prevFilterObject;
                                    }
                                }
                                return;
                            }
                            this.updateFilterIcon();
                            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 'showFilterBarOperator':
                    case 'type':
                        this.parent.refreshHeader();
                        this.refreshFilterSettings();
                        if (this.parent.height === '100%') {
                            this.parent.scrollModule.refresh();
                        }
                        break;
                }
            }
        };
        Filter.prototype.refreshFilterSettings = function () {
            if (this.filterSettings.type === 'FilterBar') {
                for (var i = 0; i < this.filterSettings.columns.length; i++) {
                    this.column = this.parent.grabColumnByUidFromAllCols(this.filterSettings.columns[parseInt(i.toString(), 10)].uid);
                    var filterValue = this.filterSettings.columns[parseInt(i.toString(), 10)].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[parseInt(i.toString(), 10)].field;
                        this.values["" + key] = this.filterSettings.columns[parseInt(i.toString(), 10)].value;
                    }
                    var filterElement = this.getFilterBarElement(this.column.field);
                    Eif (filterElement) {
                        if (this.cellText[this.filterSettings.columns[parseInt(i.toString(), 10)].field] !== ''
                            && !ej2_base_1.isNullOrUndefined(this.cellText[this.filterSettings.columns[parseInt(i.toString(), 10)].field])) {
                            filterElement.value = this.cellText[this.column.field];
                        }
                        else {
                            filterElement.value = this.filterSettings.columns[parseInt(i.toString(), 10)].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[parseInt(i.toString(), 10)].field);
                        if (filterElement && filterElement.value !== '') {
                            filterElement.value = '';
                            delete this.values[col[parseInt(i.toString(), 10)].field];
                        }
                    }
                }
            }
        };
        Filter.prototype.updateFilterIcon = function () {
            if (this.filterSettings.columns.length === 0 && this.parent.element.querySelector('.e-filtered')) {
                var fltrIconElement = [].slice.call(this.parent.element.getElementsByClassName('e-filtered'));
                for (var i = 0, len = fltrIconElement.length; i < len; i++) {
                    fltrIconElement[parseInt(i.toString(), 10)].classList.remove('e-filtered');
                }
            }
        };
        Filter.prototype.getFilterBarElement = function (col) {
            var selector = '[id=\'' + col + '_filterBarcell\']';
            var filterElement;
            Eif (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 (fields) {
            var _this = this;
            var cols = util_1.getActualPropFromColl(this.filterSettings.columns);
            if (!ej2_base_1.isNullOrUndefined(fields)) {
                this.refresh = false;
                fields.forEach(function (field) { _this.removeFilteredColsByField(field, false); });
                this.parent.setProperties({ filterSettings: { columns: this.filterSettings.columns } }, true);
                this.parent.renderModule.refresh();
                this.refresh = true;
                return;
            }
            if (util_1.isActionPrevent(this.parent)) {
                this.parent.notify(events.preventBatch, { instance: this, handler: this.clearFiltering });
                return;
            }
            for (var i = 0; i < cols.length; i++) {
                cols[parseInt(i.toString(), 10)].uid = cols[parseInt(i.toString(), 10)].uid
                    || this.parent.getColumnByField(cols[parseInt(i.toString(), 10)].field).uid;
            }
            var colUid = cols.map(function (f) { return f.uid; });
            var filteredcols = colUid.filter(function (item, pos) { return colUid.indexOf(item) === pos; });
            this.refresh = false;
            for (var i = 0, len = filteredcols.length; i < len; i++) {
                this.removeFilteredColsByField(this.parent.getColumnByUid(filteredcols[parseInt(i.toString(), 10)]).field, false);
            }
            this.refresh = true;
            if (filteredcols.length) {
                this.parent.renderModule.refresh();
            }
            Iif (this.parent.filterSettings.columns.length === 0 && this.parent.element.querySelector('.e-filtered')) {
                var fltrElement = [].slice.call(this.parent.element.getElementsByClassName('e-filtered'));
                for (var i = 0, len = fltrElement.length; i < len; i++) {
                    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];
                Iif (col.field === field && this.parent.filterSettings.type === 'Menu' &&
                    (col.type === 'date' || col.type === 'datetime')) {
                    return (this.checkDateColumnValue(col.value, this.value) &&
                        col.operator === this.operator && col.predicate === this.predicate);
                }
                else if (col.field === field && col.value === this.value &&
                    col.operator === this.operator && col.predicate === this.predicate) {
                    return true;
                }
            }
            return false;
        };
        Filter.prototype.checkDateColumnValue = function (colDate, filterDate) {
            if (ej2_base_1.isNullOrUndefined(colDate) && ej2_base_1.isNullOrUndefined(filterDate)) {
                return true;
            }
            else if (colDate instanceof Date && filterDate instanceof Date) {
                return colDate.getTime() === filterDate.getTime();
            }
            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) {
            if (this.filterModule) {
                this.filterModule.isresetFocus = false;
                this.filterModule.closeDialog();
            }
            this.setFilterModel(col);
            this.filterModule.openDialog(this.createOptions(col, target, left, top));
        };
        Filter.prototype.createOptions = function (col, target, left, top) {
            var gObj = this.parent;
            var dataSource = col.filter.dataSource || gObj.dataSource && 'result' in gObj.dataSource ? gObj.dataSource :
                gObj.getDataModule().dataManager;
            var type = col.filter.type || this.parent.filterSettings.type;
            var options = {
                type: col.type, field: col.field, displayName: col.headerText,
                dataSource: dataSource, format: col.format, height: 800, columns: gObj.getColumns(),
                filteredColumns: gObj.filterSettings.columns, target: target, dataManager: gObj.getDataModule().dataManager,
                formatFn: col.getFormatter(), ignoreAccent: gObj.filterSettings.ignoreAccent,
                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: gObj.localeObj,
                isRemote: gObj.getDataModule().isRemote(), allowCaseSensitive: this.filterSettings.enableCaseSensitivity,
                isResponsiveFilter: this.parent.enableAdaptiveUI,
                operator: this.actualPredicate[col.field] && type === 'Menu' ? this.actualPredicate[col.field][0].operator : 'equal',
                parentTotalDataCount: gObj.getDataModule().isRemote() && gObj.allowPaging ? gObj.pagerModule.pagerObj.totalRecordsCount :
                    gObj.getDataModule().isRemote() ? gObj.totalDataRecordsCount : gObj.getFilteredRecords().length,
                parentCurrentViewDataCount: gObj.currentViewData.length,
                parentFilteredLocalRecords: !gObj.getDataModule().isRemote() ? gObj.getFilteredRecords() : []
            };
            return options;
        };
        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;
            }
            var colUid = cols.map(function (f) { return f.uid; });
            var filteredColsUid = colUid.filter(function (item, pos) { return colUid.indexOf(item) === pos; });
            if (!ej2_base_1.isNullOrUndefined(this.column)) {
                var col = this.column.isForeignColumn() ? this.parent.getColumnByUid(this.column.uid) :
                    this.parent.getColumnByField(field);
                this.filterObjIndex = this.getFilteredColsIndexByField(col);
                this.prevFilterObject = this.filterSettings.columns[this.filterObjIndex];
            }
            var _loop_1 = function (i, len) {
                cols[parseInt(i.toString(), 10)].uid = cols[parseInt(i.toString(), 10)].uid
                    || this_1.parent.getColumnByField(cols[parseInt(i.toString(), 10)].field).uid;
                var len_1 = cols.length;
                var column = this_1.parent.grabColumnByUidFromAllCols(filteredColsUid[parseInt(i.toString(), 10)]);
                if (column.field === field || (column.field === column.foreignKeyValue && column.isForeignColumn())) {
                    var currentPred = this_1.filterSettings.columns.filter(function (e) {
                        return e.uid === column.uid;
                    })[0];
                    if (this_1.filterSettings.type === 'FilterBar' && !isClearFilterBar) {
                        var selector = '[id=\'' + column.field + '_filterBarcell\']';
                        fCell = this_1.parent.getHeaderContent().querySelector(selector);
                        Eif (fCell) {
                            fCell.value = '';
                            delete this_1.values["" + field];
                        }
                    }
                    while (len_1--) {
                        if (cols[parseInt(len_1.toString(), 10)].uid === column.uid) {
                            cols.splice(len_1, 1);
                        }
                    }
                    var fltrElement = this_1.parent.getColumnHeaderByField(column.field);
                    if (this_1.filterSettings.type !== 'FilterBar' || this_1.parent.showColumnMenu) {
                        var iconClass = this_1.parent.showColumnMenu && column.showColumnMenu ? '.e-columnmenu' : '.e-icon-filter';
                        fltrElement.querySelector(iconClass).classList.remove('e-filtered');
                    }
                    this_1.isRemove = true;
                    if (this_1.actualPredicate["" + field]) {
                        delete this_1.actualPredicate["" + field];
                    }
                    if (this_1.values["" + field]) {
                        delete this_1.values["" + field];
                    }
                    if (this_1.refresh) {
                        this_1.parent.notify(events.modelChanged, {
                            requestType: 'filtering', type: events.actionBegin, currentFilterObject: currentPred,
                            currentFilterColumn: column, action: 'clearFilter'
                        });
                    }
                    return "break";
                }
            };
            var this_1 = this;
            for (var i = 0, len = filteredColsUid.length; i < len; i++) {
                var state_1 = _loop_1(i, len);
                if (state_1 === "break")
                    break;
            }
            this.updateFilterMsg();
        };
        Filter.prototype.getModuleName = function () {
            return 'filter';
        };
        Filter.prototype.keyUpHandlerImmediate = function (e) {
            if (e.keyCode !== 13) {
                this.keyUpHandler(e);
            }
        };
        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 (e.action === 'altDownArrow' && this.parent.filterSettings.showFilterBarOperator) {
                    var dropDownListInput = ej2_base_1.closest(target, 'span').querySelector('.e-filterbaroperator');
                    dropDownListInput.ej2_instances[0].showPopup();
                    dropDownListInput.focus();
                }
                if ((this.filterSettings.mode === 'Immediate' || (e.keyCode === 13 &&
                    !e.target.classList.contains('e-filterbaroperator')))
                    && e.keyCode !== 9 && !this.column.filterTemplate) {
                    this.value = target.value.trim();
                    this.processFilter(e);
                }
            }
            if (e.action === 'altDownArrow' && this.filterSettings.type !== 'FilterBar' && !util_2.parentsUntil(e.target, 'e-toolbar')
                && ej2_base_1.isNullOrUndefined(this.parent.element.querySelector('.e-filter-popup')) && !this.parent.enableAdaptiveUI) {
                var element = gObj.focusModule.currentInfo.element;
                Eif (element && element.classList.contains('e-headercell') && !element.classList.contains('e-stackedheadercell')) {
                    var column = gObj.getColumnByUid(element.firstElementChild.getAttribute('e-mappinguid'));
                    this.openMenuByField(column.field);
                    this.parent.focusModule.clearIndicator();
                }
            }
            if (e.action === 'escape' && this.filterSettings.type === 'Menu' && this.filterModule) {
                this.filterModule.closeDialog();
                gObj.notify(events.restoreFocus, {});
            }
        };
        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 column = 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.grabColumnByUidFromAllCols(columns[parseInt(index.toString(), 10)].uid)
                            || gObj.grabColumnByFieldFromAllCols(columns[parseInt(index.toString(), 10)]
                                .field, columns[parseInt(index.toString(), 10)].isForeignKey);
                        if (index) {
                            this.filterStatusMsg += ' && ';
                        }
                        if (!ej2_base_1.isNullOrUndefined(column.format)) {
                            var flValue = (column.type === 'date' || column.type === 'datetime' || column.type === 'dateonly') ?
                                this.valueFormatter.fromView(this.values[column.field], column.getParser(), (column.type === 'dateonly' ? 'date' : column.type)) :
                                this.values[column.field];
                            if (!(column.type === 'date' || column.type === 'datetime' || column.type === 'dateonly')) {
                                var formater = this.serviceLocator.getService('valueFormatter');
                                getFormatFlValue = formater.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);
                    if (this.parent.height === '100%') {
                        this.parent.scrollModule.refresh();
                    }
                }
                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;
            if (column.type === 'number') {
                Iif (ej2_data_1.DataUtil.operatorSymbols["" + value] || this.skipNumberInput.indexOf(value) > -1) {
                    isSkip = true;
                }
            }
            else if (column.type === 'string') {
                for (var _i = 0, value_1 = value; _i < value_1.length; _i++) {
                    var val = value_1[_i];
                    Iif (this.skipStringInput.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);
            Iif (!filterElement) {
                filterElement = this.parent.getHeaderContent().querySelector(selector);
            }
            var filterValue;
            this.cellText[this.column.field] = filterElement.value;
            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.filterByMethod = false;
            this.filterByColumn(this.column.field, this.operator, this.value, this.predicate, this.filterSettings.enableCaseSensitivity, this.ignoreAccent, this.column.isForeignColumn());
            this.filterByMethod = true;
            filterElement.value = filterValue;
            this.updateFilterMsg();
        };
        Filter.prototype.validateFilterValue = function (value) {
            var skipInput;
            var index;
            this.matchCase = this.filterSettings.enableCaseSensitivity;
            switch (this.column.type) {
                case 'number':
                    if (this.column.filter.operator) {
                        this.operator = this.column.filter.operator;
                    }
                    else {
                        this.operator = this.filterOperators.equal;
                    }
                    skipInput = ['>', '<', '=', '!'];
                    for (var i = 0; i < value.length; i++) {
                        if (skipInput.indexOf(value[parseInt(i.toString(), 10)]) > -1) {
                            index = i;
                            break;
                        }
                    }
                    this.getOperator(value.substring(index));
                    if (index !== 0) {
                        this.value = value.substring(0, index);
                    }
                    if (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 (this.column.filter.operator) {
                        this.operator = this.column.filter.operator;
                    }
                    else {
                        if (value.indexOf('*') !== -1 || value.indexOf('?') !== -1 || value.indexOf('%3f') !== -1) {
                            this.operator = this.filterOperators.wildCard;
                        }
                        else if (value.indexOf('%') !== -1) {
                            this.operator = this.filterOperators.like;
                        }
                        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:
                    if (this.column.filter.operator) {
                        this.operator = this.column.filter.operator;
                    }
                    else {
                        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 () {
            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') },
                { value: 'isnull', text: this.l10n.getConstant('IsNull') },
                { value: 'isnotnull', text: this.l10n.getConstant('NotNull') }
            ];
            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: 'isempty', text: this.l10n.getConstant('IsEmpty') },
                    { value: 'doesnotstartwith', text: this.l10n.getConstant('NotStartsWith') },
                    { value: 'doesnotendwith', text: this.l10n.getConstant('NotEndsWith') },
                    { value: 'doesnotcontain', text: this.l10n.getConstant('NotContains') },
                    { value: 'notequal', text: this.l10n.getConstant('NotEqual') },
                    { value: 'isnotempty', text: this.l10n.getConstant('IsNotEmpty') },
                    { value: 'like', text: this.l10n.getConstant('Like') }
                ],
                numberOperator: numOptr,
                dateOperator: numOptr,
                datetimeOperator: numOptr,
                dateonlyOperator: numOptr,
                booleanOperator: [
                    { value: 'equal', text: this.l10n.getConstant('Equal') },
                    { value: 'notequal', text: this.l10n.getConstant('NotEqual') }
                ]
            };
        };
        Filter.prototype.openMenuByField = function (field) {
            var gObj = this.parent;
            if (gObj.enableAdaptiveUI) {
                this.showCustomFilter(false);
                return;
            }
            var column = gObj.getColumnByField(field);
            var header = gObj.getColumnHeaderByField(field);
            var target = header.querySelector('.e-filtermenudiv');
            Iif (!target) {
                return;
            }
            var gClient = gObj.element.getBoundingClientRect();
            var fClient = target.getBoundingClientRect();
            this.filterDialogOpen(column, target, fClient.right - gClient.left, fClient.bottom - gClient.top);
        };
        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'));
                this.column = col;
                if (this.fltrDlgDetails.field === col.field && this.fltrDlgDetails.isOpen) {
                    return;
                }
                if (this.filterModule) {
                    this.filterModule.closeDialog();
                }
                this.fltrDlgDetails = { field: col.field, isOpen: true };
                this.openMenuByField(col.field);
            }
        };
        Filter.prototype.clickHandler = function (e) {
            if (this.filterSettings.type === 'FilterBar' && this.filterSettings.showFilterBarOperator) {
                Eif (util_2.parentsUntil(e.target, 'e-filterbarcell') &&
                    e.target.classList.contains('e-input-group-icon')) {
                    var filterOperatorElement = ej2_base_1.closest(e.target, 'div').
                        querySelector('.e-filterbaroperator');
                    Iif (filterOperatorElement) {
                        filterOperatorElement.focus();
                    }
                    else {
                        e.target.focus();
                    }
                }
                Iif (e.target.classList.contains('e-list-item')) {
                    var inputId = document.querySelector('.e-popup-open').getAttribute('id').replace('_popup', '');
                    if (inputId.indexOf('grid-column') !== -1) {
                        ej2_base_1.closest(document.getElementById(inputId), 'div').querySelector('.e-filtertext').focus();
                    }
                }
            }
            if (this.filterSettings.mode === 'Immediate' || this.parent.filterSettings.type === 'Menu' ||
                this.parent.filterSettings.type === 'CheckBox' || this.parent.filterSettings.type === 'Excel') {
                var target = e.target;
                var datepickerEle = target.classList.contains('e-day');
                var dialog = util_2.parentsUntil(this.parent.element, 'e-dialog');
                var hasDialog = false;
                var popupEle = util_2.parentsUntil(target, 'e-popup');
                var hasDialogClosed = this.parent.element.classList.contains('e-device') ?
                    document.querySelector('.e-filter-popup') : document.getElementById(this.parent.element.id + '_e-popup') ?
                    document.getElementById(this.parent.element.id + '_e-popup').querySelector('.e-filter-popup') : this.parent.element.querySelector('.e-filter-popup');
                Iif (dialog && popupEle) {
                    hasDialog = dialog.id === popupEle.id;
                }
                if ((this.filterModule && hasDialogClosed && (util_2.parentsUntil(target, 'e-excel-ascending') ||
                    util_2.parentsUntil(target, 'e-excel-descending')))) {
                    this.filterModule.closeDialog(target);
                }
                if (util_2.parentsUntil(target, 'e-filter-popup') || target.classList.contains('e-filtermenudiv')) {
                    return;
                }
                else if (this.filterModule && !util_2.parentsUntil(target, 'e-date-overflow') && (!util_2.parentsUntil(target, 'e-popup-wrapper')
                    && (!ej2_base_1.closest(target, '.e-filter-item.e-menu-item'))) && !datepickerEle
                    && !(util_2.parentsUntil(target, 'e-search-wrapper') && !hasDialogClosed)) {
                    if ((hasDialog && (!util_2.parentsUntil(target, 'e-filter-popup'))
                        && (!util_2.parentsUntil(target, 'e-popup-flmenu'))) || (!popupEle && hasDialogClosed)) {
                        this.filterModule.isresetFocus = util_2.parentsUntil(target, 'e-grid') &&
                            util_2.parentsUntil(target, 'e-grid').id === this.parent.element.id && !(util_2.parentsUntil(target, 'e-search-wrapper')
                            && hasDialogClosed);
                        this.filterModule.closeDialog(target);
                    }
                }
            }
        };
        Filter.prototype.filterHandler = function (args) {
            this.actualPredicate[args.field] = args.actualPredicate;
            this.actualData = Object.keys(this.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);
            this.checkboxFilterObject = dataManager.dataSource.json;
            this.checkboxPrevFilterObject = dataManager.executeLocal(query);
            for (var i = 0; i < this.checkboxPrevFilterObject.length; i++) {
                var index = -1;
                for (var j = 0; j < this.filterSettings.columns.length; j++) {
                    if (this.checkboxPrevFilterObject[parseInt(i.toString(), 10)].field ===
                        this.filterSettings.columns[parseInt(j.toString(), 10)].field) {
                        index = j;
                        break;
                    }
                }
                Eif (index !== -1) {
                    this.filterSettings.columns.splice(index, 1);
                }
            }
            if (this.values[args.field]) {
                delete this.values[args.field];
            }
            var col = this.parent.getColumnByField(args.field);
            var iconClass = this.parent.showColumnMenu && col.showColumnMenu ? '.e-columnmenu' : '.e-icon-filter';
            var 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');
                }
                args.requestType = 'filtering';
                this.parent.renderModule.refresh(args);
            }
            this.parent.dataBind();
        };
        Filter.prototype.updateFilter = function () {
            var cols = this.filterSettings.columns;
            this.actualPredicate = {};
            for (var i = 0; i < cols.length; i++) {
                this.column = this.parent.getColumnByField(cols[parseInt(i.toString(), 10)].field) ||
                    util_1.getColumnByForeignKeyValue(cols[parseInt(i.toString(), 10)].field, this.parent.getForeignKeyColumns());
                var fieldName = cols[parseInt(i.toString(), 10)].field;
                if (!this.parent.getColumnByField(cols[parseInt(i.toString(), 10)].field)) {
                    fieldName = util_1.getColumnByForeignKeyValue(cols[parseInt(i.toString(), 10)].field, this.parent.getForeignKeyColumns()).field;
                }
                this.refreshFilterIcon(fieldName, cols[parseInt(i.toString(), 10)].operator, cols[parseInt(i.toString(), 10)].value, cols[parseInt(i.toString(), 10)].type, cols[parseInt(i.toString(), 10)].predicate, cols[parseInt(i.toString(), 10)].matchCase, cols[parseInt(i.toString(), 10)].ignoreAccent, cols[parseInt(i.toString(), 10)].uid);
            }
        };
        Filter.prototype.refreshFilterIcon = function (fieldName, operator, value, type, predicate, matchCase, ignoreAccent, uid) {
            var obj = {
                field: fieldName,
                predicate: predicate,
                matchCase: matchCase,
                ignoreAccent: ignoreAccent,
                operator: operator,
                value: value,
                type: type
            };
            if (this.actualPredicate["" + fieldName]) {
                this.actualPredicate["" + fieldName].push(obj);
            }
            else {
                this.actualPredicate["" + fieldName] = [obj];
            }
            var field = uid ? this.parent.grabColumnByUidFromAllCols(uid).field : fieldName;
            this.addFilteredClass(field);
        };
        Filter.prototype.addFilteredClass = function (fieldName) {
            var filterIconElement;
            var col = this.parent.getColumnByField(fieldName);
            if (this.parent.showColumnMenu && col.showColumnMenu) {
                filterIconElement = this.parent.getColumnHeaderByField(fieldName).querySelector('.e-columnmenu');
            }
            else Eif (col) {
                filterIconElement = this.parent.getColumnHeaderByField(fieldName).querySelector('.e-icon-filter');
            }
            if (filterIconElement) {
                filterIconElement.classList.add('e-filtered');
            }
        };
        Filter.prototype.getFilterUIInfo = function () {
            return this.filterModule ? this.filterModule.getFilterUIInfo() : {};
        };
        Filter.prototype.getOperatorName = function (field) {
            return document.getElementById(this.parent.getColumnByField(field).uid).ej2_instances[0].value;
        };
        Filter.prototype.renderCheckboxOnFilterMenu = function () {
            return this.filterModule.renderCheckBoxMenu();
        };
        return Filter;
    }());
    exports.Filter = Filter;
});