all files / pivotview/actions/ pager.js

96.74% Statements 208/215
87.76% Branches 208/237
100% Functions 20/20
96.71% Lines 206/213
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   10× 10× 10×   1564×   69×     69×   78×   69× 69×   69×   69× 59× 59× 59×   69× 69× 69× 69×           69×     69×       69× 12×     57×     69× 69× 69×   69×           69× 69× 69× 69× 65× 59×                             59×   65× 61× 61× 42× 294×   61×                     61×     69× 65× 59×                             59×   65× 61× 61× 45× 360×   61×                     61×     69× 69×       69× 69× 496×     138× 138× 548×             10× 10×                             10×       69× 69× 69× 69× 69× 65×   69× 65×   69×       69×       69×     69× 61×       69×   130× 130×       130×       130× 122×   130× 130× 130×           130×           130×                   130×                   130×       130× 130×             130×       130×       130× 130×       130× 130×                   130×                   130×       130× 130×       130×       130×       130×       130× 130× 12× 12×     118× 118× 118× 118×   130× 130×   130×                     122× 118× 118× 118×               122×     130×   78× 78× 78× 78× 78×   78× 78× 78×   78× 78× 78×   78× 78× 78×   78× 69×   78×                
define(["require", "exports", "../../common/base/css-constant", "../../common/base/constant", "@syncfusion/ej2-base", "@syncfusion/ej2-grids", "@syncfusion/ej2-dropdowns", "@syncfusion/ej2-inputs"], function (require, exports, cls, events, ej2_base_1, ej2_grids_1, ej2_dropdowns_1, ej2_inputs_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var Pager = (function () {
        function Pager(parent) {
            this.parent = parent;
            this.parent.pagerModule = this;
            this.addEventListener();
        }
        Pager.prototype.getModuleName = function () {
            return 'pager';
        };
        Pager.prototype.addEventListener = function () {
            Iif (this.parent.isDestroyed) {
                return;
            }
            this.parent.on(events.initPivotPager, this.createPager, this);
        };
        Pager.prototype.removeEventListener = function () {
            if (this.parent.isDestroyed) {
                return;
            }
            Eif (ej2_base_1.isNullOrUndefined(this.parent.pagerSettings.template)) {
                this.unWireEvent();
            }
            this.parent.off(events.initPivotPager, this.createPager);
        };
        Pager.prototype.createPager = function () {
            if (ej2_base_1.select('#' + this.parent.element.id + 'pivot-pager', this.parent.element) !== null) {
                ej2_base_1.remove(ej2_base_1.select('#' + this.parent.element.id + 'pivot-pager', this.parent.element));
                this.destroy();
                this.addEventListener();
            }
            var tableWidth = (this.parent.grid ? this.parent.getGridWidthAsNumber() : this.parent.getWidthAsNumber());
            var pagerOptions = this.parent.pagerSettings;
            Eif (this.parent.enablePaging) {
                var pagerElement = ej2_base_1.createElement('div', {
                    id: this.parent.element.id + 'pivot-pager',
                    className: cls.GRID_PAGER + ' ' + (((this.parent.isAdaptive || tableWidth < 650) ? cls.DEVICE : '') + ' ' + (this.parent.enableRtl ? cls.RTL : '') + ' ' + (this.parent.pagerSettings.position === 'Top' ? ' ' + cls.GRID_PAGER_TOP : ' ' + cls.GRID_PAGER_BOTTOM)
                        + ' ' + ((pagerOptions.enableCompactView || tableWidth < 400) ? cls.COMPACT_VIEW : '')),
                    styles: 'width:' + (this.parent.grid ? this.parent.getGridWidthAsNumber() : this.parent.getWidthAsNumber()) + 'px'
                });
                Iif (this.parent.showFieldList && ej2_base_1.select('#' + this.parent.element.id + '_PivotFieldList', this.parent.element) && pagerOptions.position === 'Top') {
                    this.parent.element.insertBefore(pagerElement, ej2_base_1.select('#' + this.parent.element.id + '_PivotFieldList', this.parent.element));
                }
                else Iif (this.parent.showGroupingBar && ej2_base_1.select('#' + this.parent.element.id + ' .' + cls.GRID_GROUPING_BAR_CLASS, this.parent.element) && pagerOptions.position === 'Top') {
                    this.parent.element.insertBefore(pagerElement, ej2_base_1.select('#' + this.parent.element.id + ' .' + cls.GRID_GROUPING_BAR_CLASS, this.parent.element));
                }
                else {
                    if (this.parent.pagerSettings.position === 'Top') {
                        this.parent.element.insertBefore(pagerElement, ej2_base_1.select('#' + this.parent.element.id + '_grid', this.parent.element));
                    }
                    else {
                        this.parent.element.append(pagerElement);
                    }
                }
                var _this_1 = this;
                var tempFunc = function () {
                    return _this_1.createPagerContainer();
                };
                this.pager = new ej2_grids_1.Pager({
                    enableRtl: this.parent.enableRtl,
                    locale: this.parent.locale,
                    template: pagerOptions.template === '' || pagerOptions.template ? pagerOptions.template : ej2_base_1.initializeCSPTemplate(tempFunc),
                    cssClass: this.parent.cssClass
                });
                this.pager.isVue = this.parent.isVue;
                this.pager.appendTo(pagerElement);
                Eif (ej2_base_1.isNullOrUndefined(pagerOptions.template)) {
                    if (pagerOptions.showRowPager) {
                        if (!pagerOptions.enableCompactView && tableWidth > 400) {
                            var rowPagerTextBox = new ej2_inputs_1.NumericTextBox({
                                min: 1,
                                max: this.parent.engineModule.rowPageCount,
                                showSpinButton: false,
                                format: '#',
                                validateDecimalOnType: true,
                                decimals: 0,
                                strictMode: true,
                                value: this.parent.pageSettings.currentRowPage,
                                enableRtl: this.parent.enableRtl,
                                locale: this.parent.locale,
                                width: tableWidth < 669 ? '50px' : '64px',
                                change: this.rowPageChange.bind(this),
                                cssClass: this.parent.cssClass
                            });
                            rowPagerTextBox.appendTo(ej2_base_1.select('#' + this.parent.element.id + '_row_textbox', this.parent.element));
                        }
                        if (pagerOptions.showRowPageSize) {
                            var rowPages = this.parent.pagerSettings.rowPageSizes.slice(0);
                            if (this.parent.pagerSettings.rowPageSizes.indexOf(this.parent.pageSettings.rowPageSize) === -1) {
                                rowPages.push(this.parent.pageSettings.rowPageSize);
                                rowPages.sort(function (a, b) { return a - b; });
                            }
                            var rowPageSizeDropDown = new ej2_dropdowns_1.DropDownList({
                                dataSource: rowPages,
                                value: this.parent.pageSettings.rowPageSize,
                                enableRtl: this.parent.enableRtl,
                                locale: this.parent.locale,
                                change: this.rowPageSizeChange.bind(this),
                                popupHeight: '300px',
                                popupWidth: '100%',
                                width: '64px',
                                cssClass: this.parent.cssClass
                            });
                            rowPageSizeDropDown.appendTo(ej2_base_1.select('#' + this.parent.element.id + '_' + 'row' + '_size_list', this.parent.element));
                        }
                    }
                    if (pagerOptions.showColumnPager) {
                        if (!pagerOptions.enableCompactView && tableWidth > 400) {
                            var columnPagerTextBox = new ej2_inputs_1.NumericTextBox({
                                min: 1,
                                max: this.parent.engineModule.columnPageCount,
                                showSpinButton: false,
                                format: '#',
                                validateDecimalOnType: true,
                                decimals: 0,
                                strictMode: true,
                                value: this.parent.pageSettings.currentColumnPage,
                                enableRtl: this.parent.enableRtl,
                                locale: this.parent.locale,
                                width: tableWidth < 669 ? '50px' : '64px',
                                change: this.columnPageChange.bind(this),
                                cssClass: this.parent.cssClass
                            });
                            columnPagerTextBox.appendTo(ej2_base_1.select('#' + this.parent.element.id + '_column_textbox', this.parent.element));
                        }
                        if (pagerOptions.showColumnPageSize) {
                            var columnPages = this.parent.pagerSettings.columnPageSizes.slice(0);
                            if (this.parent.pagerSettings.columnPageSizes.indexOf(this.parent.pageSettings.columnPageSize) === -1) {
                                columnPages.push(this.parent.pageSettings.columnPageSize);
                                columnPages.sort(function (a, b) { return a - b; });
                            }
                            var columnPageSizeDropDown = new ej2_dropdowns_1.DropDownList({
                                dataSource: columnPages,
                                value: this.parent.pageSettings.columnPageSize,
                                enableRtl: this.parent.enableRtl,
                                locale: this.parent.locale,
                                change: this.columnPageSizeChange.bind(this),
                                popupHeight: '300px',
                                popupWidth: '100%',
                                width: '64px',
                                cssClass: this.parent.cssClass
                            });
                            columnPageSizeDropDown.appendTo(ej2_base_1.select('#' + this.parent.element.id + '_' + 'column' + '_size_list', this.parent.element));
                        }
                    }
                    this.unWireEvent();
                    this.wireEvent();
                }
            }
        };
        Pager.prototype.wireEvent = function () {
            var elements = [].slice.call(this.parent.element.querySelectorAll('.' + cls.FIRST_PAGER_ICON + ', .' + cls.PREV_PAGER_ICON + ', .' + cls.NEXT_PAGER_ICON + ', .' + cls.LAST_PAGER_ICON));
            for (var i = 0; i < elements.length; i++) {
                ej2_base_1.EventHandler.add(elements[i], 'click', this.updatePageSettings, this);
            }
        };
        Pager.prototype.unWireEvent = function () {
            var elements = [].slice.call(this.parent.element.querySelectorAll('.' + cls.FIRST_PAGER_ICON + ', .' + cls.PREV_PAGER_ICON + ', .' + cls.NEXT_PAGER_ICON + ', .' + cls.LAST_PAGER_ICON));
            for (var i = 0; i < elements.length; i++) {
                ej2_base_1.EventHandler.remove(elements[i], 'click', this.updatePageSettings);
            }
        };
        Pager.prototype.columnPageChange = function (args) {
            this.parent.pageSettings.currentColumnPage = args.value;
        };
        Pager.prototype.rowPageChange = function (args) {
            this.parent.pageSettings.currentRowPage = args.value;
        };
        Pager.prototype.columnPageSizeChange = function (args) {
            this.parent.pageSettings.columnPageSize = Number(args.value);
        };
        Pager.prototype.rowPageSizeChange = function (args) {
            this.parent.pageSettings.rowPageSize = Number(args.value);
        };
        Pager.prototype.updatePageSettings = function (args) {
            var targetId = args.target.id;
            switch (targetId) {
                case this.parent.element.id + '_row_firstIcon':
                    this.parent.pageSettings.currentRowPage = 1;
                    break;
                case this.parent.element.id + '_row_prevIcon':
                    this.parent.pageSettings.currentRowPage = this.parent.pageSettings.currentRowPage > 1
                        ? this.parent.pageSettings.currentRowPage - 1 : this.parent.pageSettings.currentRowPage;
                    break;
                case this.parent.element.id + '_row_nextIcon':
                    this.parent.pageSettings.currentRowPage = this.parent.pageSettings.currentRowPage < this.parent.engineModule.rowPageCount
                        ? this.parent.pageSettings.currentRowPage + 1 : this.parent.pageSettings.currentRowPage;
                    break;
                case this.parent.element.id + '_row_lastIcon':
                    this.parent.pageSettings.currentRowPage = this.parent.engineModule.rowPageCount;
                    break;
                case this.parent.element.id + '_column_firstIcon':
                    this.parent.pageSettings.currentColumnPage = 1;
                    break;
                case this.parent.element.id + '_column_prevIcon':
                    this.parent.pageSettings.currentColumnPage = this.parent.pageSettings.currentColumnPage > 1
                        ? this.parent.pageSettings.currentColumnPage - 1 : this.parent.pageSettings.currentColumnPage;
                    break;
                case this.parent.element.id + '_column_nextIcon':
                    this.parent.pageSettings.currentColumnPage = this.parent.pageSettings.currentColumnPage
                        < this.parent.engineModule.columnPageCount ? this.parent.pageSettings.currentColumnPage + 1
                        : this.parent.pageSettings.currentColumnPage;
                    break;
                case this.parent.element.id + '_column_lastIcon':
                    this.parent.pageSettings.currentColumnPage = this.parent.engineModule.columnPageCount;
                    break;
            }
            if (targetId.indexOf('_row') !== -1) {
                this.parent.actionObj.actionName = events.rowPageNavigation;
            }
            else Eif (targetId.indexOf('_column') !== -1) {
                this.parent.actionObj.actionName = events.columnPageNavigation;
            }
        };
        Pager.prototype.createPagerContainer = function () {
            var tableWidth = (this.parent.grid ? this.parent.getGridWidthAsNumber() : this.parent.getWidthAsNumber());
            var pagerOptions = this.parent.pagerSettings;
            var rowMainDiv;
            var columnMainDiv;
            if (pagerOptions.showRowPager) {
                rowMainDiv = this.createPagerItems('row', pagerOptions, tableWidth);
            }
            if (pagerOptions.showColumnPager) {
                columnMainDiv = this.createPagerItems('column', pagerOptions, tableWidth);
            }
            var mainDivPagerSettings = ej2_base_1.createElement('div', {
                id: this.parent.element.id + '_' + 'mainDiv',
                className: (cls.GRID_PAGER_DIV + ' ' + ((!pagerOptions.showRowPager || !pagerOptions.showColumnPager) ? cls.GRID_PAGER_SINGLE_DIV : '') + ' ' + (pagerOptions.isInversed ? cls.INVERSE : ''))
            });
            var vertiSeparator = ej2_base_1.createElement('div', {
                id: this.parent.element.id + '_' + 'vertical' + '_separator',
                className: (this.parent.isAdaptive || tableWidth < 650) ? cls.PIVOT_H_SEPARATOR : cls.PIVOT_V_SEPARATOR
            });
            Iif (pagerOptions.isInversed && pagerOptions.showColumnPager && pagerOptions.showRowPager) {
                mainDivPagerSettings.append(columnMainDiv, vertiSeparator, rowMainDiv);
            }
            else if (pagerOptions.showColumnPager && pagerOptions.showRowPager) {
                mainDivPagerSettings.append(rowMainDiv, vertiSeparator, columnMainDiv);
            }
            else if (pagerOptions.showRowPager && !pagerOptions.showColumnPager) {
                mainDivPagerSettings.append(rowMainDiv);
            }
            else Eif (!pagerOptions.showRowPager && pagerOptions.showColumnPager) {
                mainDivPagerSettings.append(columnMainDiv);
            }
            return mainDivPagerSettings.outerHTML;
        };
        Pager.prototype.createPagerItems = function (axis, pagerOptions, tableWidth) {
            var isSinglePagerEnabled = (!pagerOptions.showRowPager || !pagerOptions.showColumnPager);
            var pagerAxisMainDiv = ej2_base_1.createElement('div', {
                id: this.parent.element.id + '_' + axis + '_mainDiv',
                className: (axis === 'row' ? (cls.PIVOT_ROW_PAGER_DIV + ' ' + (!pagerOptions.showRowPageSize ? cls.PAGE_SIZE_DISABLE : '')) : (cls.PIVOT_COLUMN_PAGER_DIV + ' ' + (!pagerOptions.showColumnPageSize ? cls.PAGE_SIZE_DISABLE : '')))
            });
            var pagerIconContainer = ej2_base_1.createElement('div', {
                id: this.parent.element.id + '_' + axis + '_pagerSettings',
                className: (axis === 'row' ? cls.PIVOT_ROW_PAGER_SETTINGS : cls.PIVOT_COLUMN_PAGER_SETTINGS)
            });
            if (this.parent.pagerSettings.showColumnPager && this.parent.pagerSettings.showRowPager) {
                pagerIconContainer.classList.add(cls.PIVOT_BOTH_PAGER_SETTINGS);
            }
            var isFirstDisable = (axis === 'column' && this.parent.pageSettings.currentColumnPage === 1) || (axis === 'row' && this.parent.pageSettings.currentRowPage === 1);
            var isLastDisable = (axis === 'column' && this.parent.pageSettings.currentColumnPage === this.parent.engineModule.columnPageCount) || (axis === 'row' && this.parent.pageSettings.currentRowPage === this.parent.engineModule.rowPageCount);
            var navIconContainer = ej2_base_1.createElement('div', {
                id: this.parent.element.id + '_' + axis + '_NavContainer',
                attrs: {
                    class: cls.PIVOT_PAGER_NAV_CONTAINER + ' ' + cls.PIVOT_PAGER_CONTAINER
                }
            });
            var pageInfoContainer = ej2_base_1.createElement('div', {
                id: this.parent.element.id + '_' + axis + '_PageInfoContainer',
                attrs: {
                    class: cls.PIVOT_PAGER_INFO_CONTAINER + ' ' + cls.PIVOT_PAGER_CONTAINER
                }
            });
            var firstIcon = ej2_base_1.createElement('div', {
                id: this.parent.element.id + '_' + axis + '_firstIcon',
                attrs: {
                    class: cls.PIVOT_FIRST_ICON_DEFAULT + (isFirstDisable ? (' ' + cls.DISABLE_FIRST_PAGE + ' ' + cls.ICON_DISABLE) : ' ' + cls.PIVOT_FIRST_ICON_ENABLE),
                    title: this.parent.localeObj.getConstant('goToFirstPage'),
                    'aria-label': this.parent.localeObj.getConstant('goToFirstPage'),
                    tabindex: '0',
                    role: 'button'
                }
            });
            var prevIcon = ej2_base_1.createElement('div', {
                id: this.parent.element.id + '_' + axis + '_prevIcon',
                attrs: {
                    class: cls.PIVOT_PREV_ICON_DEFAULT + (isFirstDisable ? (' ' + cls.DISABLE_PREV_PAGE + ' ' + cls.ICON_DISABLE) : ' ' + cls.PIVOT_PREV_ICON_ENABLE),
                    title: this.parent.localeObj.getConstant('goToPreviousPage'),
                    'aria-label': this.parent.localeObj.getConstant('goToPreviousPage'),
                    tabindex: '0',
                    role: 'button'
                }
            });
            var pagerString = ej2_base_1.createElement('span', {
                id: this.parent.element.id + '_' + axis + '_pagerString',
                className: axis === 'row' ? cls.PIVOT_ROW_PAGER_STRING : cls.PIVOT_COLUMN_PAGER_STRING
            });
            pagerString.innerText = axis === 'row' ? this.parent.localeObj.getConstant('rowPage') : this.parent.localeObj.getConstant('columnPage');
            var pagerTextBoxDiv = ej2_base_1.createElement('input', {
                id: this.parent.element.id + '_' + axis + '_textbox',
                className: axis === 'row' ? cls.PIVOT_ROW_DROPDOWN : cls.PIVOT_COLUMN_DROPDOWN,
                attrs: {
                    'placeholder': '1'
                }
            });
            var mainOfStringDiv = ej2_base_1.createElement('div', {
                id: this.parent.element.id + '_' + axis + '_of_string_mainDiv',
                className: axis === 'row' ? cls.PIVOT_ROW_OF_STRING_MAINDIV : cls.PIVOT_COLUMN_OF_STRING_MAINDIV
            });
            var ofString = ej2_base_1.createElement('span', {
                id: this.parent.element.id + '_' + axis + '_ofString',
                className: axis === 'row' ? cls.PIVOT_ROW_OF_STRING : cls.PIVOT_COLUMN_OF_STRING
            });
            ofString.innerText = this.parent.localeObj.getConstant('of') + ' ';
            var pagerNumber = ej2_base_1.createElement('span', {
                id: this.parent.element.id + '_' + axis + '_pagerNumber',
                className: axis === 'row' ? cls.PIVOT_ROW_PAGER_NUMBER : cls.PIVOT_COLUMN_PAGER_NUMBER
            });
            pagerNumber.innerText = (axis === 'row' ? this.parent.engineModule.rowPageCount : this.parent.engineModule.columnPageCount).toString();
            var nextIcon = ej2_base_1.createElement('div', {
                id: this.parent.element.id + '_' + axis + '_nextIcon',
                attrs: {
                    class: cls.PIVOT_NEXT_ICON_DEFAULT + (isLastDisable ? (' ' + cls.DISABLE_NEXT_PAGE + ' ' + cls.ICON_DISABLE) : ' ' + cls.PIVOT_NEXT_ICON_ENABLE),
                    title: this.parent.localeObj.getConstant('goToNextPage'),
                    'aria-label': this.parent.localeObj.getConstant('goToNextPage'),
                    tabindex: '0',
                    role: 'button'
                }
            });
            var lastIcon = ej2_base_1.createElement('div', {
                id: this.parent.element.id + '_' + axis + '_lastIcon',
                attrs: {
                    class: cls.PIVOT_LAST_ICON_DEFAULT + (isLastDisable ? (' ' + cls.DISABLE_LAST_PAGE + ' ' + cls.ICON_DISABLE) : ' ' + cls.PIVOT_LAST_ICON_ENABLE),
                    title: this.parent.localeObj.getConstant('goToLastPage'),
                    'aria-label': this.parent.localeObj.getConstant('goToLastPage'),
                    tabindex: '0',
                    role: 'button'
                }
            });
            var pageSize = ej2_base_1.createElement('span', {
                id: this.parent.element.id + '_' + axis + '_size',
                className: axis === 'row' ? cls.PIVOT_ROW_SIZE : cls.PIVOT_COLUMN_SIZE
            });
            pageSize.innerText = axis === 'row' ? this.parent.localeObj.getConstant('rowPerPage') : this.parent.localeObj.getConstant('columnPerPage');
            var pageSizeDropDownMainDiv = ej2_base_1.createElement('div', {
                id: this.parent.element.id + '_' + axis + '_size_list_maindiv',
                className: cls.PIVOT_PAGE_SIZE_LIST_MAINDIV + ' ' + cls.PIVOT_PAGER_CONTAINER
            });
            var pageSizeDropDown = ej2_base_1.createElement('div', {
                id: this.parent.element.id + '_' + axis + '_size_list',
                className: axis === 'row' ? cls.PIVOT_ROW_SIZE_LIST : cls.PIVOT_COLUMN_SIZE_LIST
            });
            var pagerStringContainer = ej2_base_1.createElement('div', {
                id: this.parent.element.id + '_' + axis + '_text_div',
                className: cls.PIVOT_TEXT_DIV
            });
            var pagerElementContainer = ej2_base_1.createElement('div', {
                id: this.parent.element.id + '_' + axis + '_text_div_1',
                className: cls.PIVOT_TEXT_DIV_1
            });
            pageSizeDropDownMainDiv.append(pageSizeDropDown);
            if (pagerOptions.enableCompactView || tableWidth < 400) {
                navIconContainer.append(prevIcon, nextIcon);
                pagerIconContainer.append(navIconContainer);
            }
            else {
                mainOfStringDiv.append(ofString, pagerNumber);
                navIconContainer.append(firstIcon, prevIcon, nextIcon, lastIcon);
                pageInfoContainer.append(pagerTextBoxDiv, mainOfStringDiv);
                pagerIconContainer.append(navIconContainer, pageInfoContainer);
            }
            Eif ((axis === 'row' && pagerOptions.showRowPager) || (axis === 'column' && pagerOptions.showColumnPager)) {
                if (((axis === 'column' && !pagerOptions.showRowPager) || (axis === 'row' && !pagerOptions.showColumnPager)) && (isSinglePagerEnabled)) {
                    pagerElementContainer.append(pageSize, pageSizeDropDownMainDiv);
                }
                if ((!pagerOptions.showColumnPager || !pagerOptions.showRowPager) && (isSinglePagerEnabled)) {
                    if (axis === 'row') {
                        if (pagerOptions.showRowPageSize) {
                            pagerAxisMainDiv.append(pagerIconContainer, pagerString, pagerElementContainer);
                        }
                        else {
                            pagerAxisMainDiv.append(pagerIconContainer, pagerString);
                        }
                    }
                    if (axis === 'column') {
                        if (pagerOptions.showColumnPageSize) {
                            pagerAxisMainDiv.append(pagerIconContainer, pagerString, pagerElementContainer);
                        }
                        else {
                            pagerAxisMainDiv.append(pagerIconContainer, pagerString);
                        }
                    }
                }
                else {
                    if ((axis === 'row' && pagerOptions.showRowPageSize) || (axis === 'column' && pagerOptions.showColumnPageSize)) {
                        Eif (!pagerOptions.enableCompactView && tableWidth > 400) {
                            pagerStringContainer.append(pagerString, pageSize);
                            pagerElementContainer.append(pagerIconContainer, pageSizeDropDownMainDiv);
                        }
                        else {
                            pagerStringContainer.append(pagerString, pagerIconContainer);
                            pagerElementContainer.append(pageSize, pageSizeDropDownMainDiv);
                        }
                    }
                    else Eif ((axis === 'row' && !pagerOptions.showRowPageSize) || (axis === 'column' && !pagerOptions.showColumnPageSize)) {
                        pagerStringContainer.append(pagerString);
                        pagerElementContainer.append(pagerIconContainer);
                    }
                    pagerAxisMainDiv.append(pagerStringContainer, pagerElementContainer);
                }
            }
            return pagerAxisMainDiv;
        };
        Pager.prototype.destroy = function () {
            this.removeEventListener();
            Eif (this.parent.pagerModule) {
                var element = ej2_base_1.select('#' + this.parent.element.id + '_column_textbox', this.parent.element);
                var columnPagerTextBox = element ? ej2_base_1.getInstance(element, ej2_inputs_1.NumericTextBox) : null;
                if (columnPagerTextBox) {
                    columnPagerTextBox.destroy();
                    columnPagerTextBox = null;
                }
                element = ej2_base_1.select('#' + this.parent.element.id + '_row_textbox', this.parent.element);
                var rowPagerTextBox = element ? ej2_base_1.getInstance(element, ej2_inputs_1.NumericTextBox) : null;
                if (rowPagerTextBox) {
                    rowPagerTextBox.destroy();
                    rowPagerTextBox = null;
                }
                element = ej2_base_1.select('#' + this.parent.element.id + '_' + 'column' + '_size_list', this.parent.element);
                var columnPageSizeDropDown = element ? ej2_base_1.getInstance(element, ej2_dropdowns_1.DropDownList) : null;
                if (columnPageSizeDropDown) {
                    columnPageSizeDropDown.destroy();
                    columnPageSizeDropDown = null;
                }
                element = ej2_base_1.select('#' + this.parent.element.id + '_' + 'row' + '_size_list', this.parent.element);
                var rowPageSizeDropDown = element ? ej2_base_1.getInstance(element, ej2_dropdowns_1.DropDownList) : null;
                if (rowPageSizeDropDown) {
                    rowPageSizeDropDown.destroy();
                    rowPageSizeDropDown = null;
                }
                if (this.pager) {
                    this.pager.destroy();
                }
                this.pager = null;
            }
            else {
                return;
            }
        };
        return Pager;
    }());
    exports.Pager = Pager;
});