all files / grid/renderer/ render.js

88.98% Statements 452/508
86.8% Branches 388/447
86% Functions 43/50
89% Lines 445/500
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   1195× 1195× 1195× 1195× 1195× 1195× 1195× 1195× 1195×   1196× 1196× 1196× 1196× 1196× 1196× 1187× 1187× 1187× 1187×   1196× 1196× 1196× 298×   1196×   894× 894× 894× 894× 894× 894× 894× 11× 11×     11×   11×     11×   883×   883×   83×   883×     883× 13× 13× 13× 13×             883×   882×           880×                                                                       173×   2092× 2092× 2092× 2092×     2092× 2039×   2092× 52×     2092× 2092× 2092× 2092× 2092× 2092× 18× 18×   2092× 2074×     2074×     18× 17× 17×   15×     2092× 2092× 2092×   2092× 53× 53× 53× 53×     2092× 30×   2092× 21×   18× 18×   2092× 2092×       249× 249× 27× 27× 36×   27×     16× 16× 16× 16×     16×             16× 16× 16× 16× 16×                             132×   1322× 1322× 1322× 1322×   1322× 1322× 1322× 84×   1322×   1322× 1322× 1322×                   1320×           1322× 128× 128×   1322×   1322× 1322× 1322× 1322× 133× 63×   133× 133× 130×           71× 69×     1213× 1213× 1213× 1213× 1213× 1213× 1213× 6297× 6297×     6297×       6297× 23×   6297× 5769× 5769× 4638×         528×   6297× 6297×     86× 86×   6297× 640×   5657× 1938×   6297×       2084× 2084× 2084× 2084× 2084× 2084×       2084× 2062× 52×   2010× 2010× 2010×     2010×       2002×       2002× 2002× 2002× 2002×   1957×   2002× 2002× 2002× 2002× 227×   2002×           1998× 14× 14×   1996× 1143× 1068×     75×     1996×     1996×   1996×       1996× 1996×   265×   1992× 1886× 17× 17×   1886× 1879×     1873×             106×     106×         106× 106× 106× 106× 106× 105×   105× 104× 104× 104×     105×     105×   1989× 1989× 1989× 1977×       21× 20× 20×   21× 21× 21× 21×       21× 21× 19×     19×   2009×       2002×   14× 14× 14× 12× 12×   12× 12× 12×   12× 12× 12× 12×   14× 14× 596×     596×     594× 594×       12× 12× 12× 594× 594× 12× 594× 594×       12×   1195× 1195× 1195× 1195× 1195× 1195× 1195× 1195× 1195× 1195× 1195× 1195× 1195× 1195× 1195× 1195× 1195×   1196× 1196×   1195× 1195× 1195× 1195× 1195× 1195× 1195×   28× 28× 28×   26× 26× 26× 26× 52× 52× 104×   52×   26× 26× 26× 26× 26× 26× 26×               26×   26× 26× 26× 26×   26×   258×   255×   74× 74× 74× 154×   154× 154× 154× 154× 154× 48×     154× 154× 20× 20× 33× 33× 33× 33× 33× 33× 33×                   33×             74×        
define(["require", "exports", "@syncfusion/ej2-base", "@syncfusion/ej2-base", "@syncfusion/ej2-data", "../services/value-formatter", "../base/enum", "../actions/data", "../models/column", "../models/row", "../models/cell", "../base/constant", "../base/util", "../renderer/content-renderer", "../renderer/header-renderer", "../renderer/cell-renderer", "../renderer/header-cell-renderer", "../renderer/stacked-cell-renderer", "../renderer/indent-cell-renderer", "../renderer/caption-cell-renderer", "../renderer/expand-cell-renderer", "../renderer/header-indent-renderer", "../renderer/detail-header-indent-renderer", "../renderer/detail-expand-cell-renderer", "./row-drag-drop-renderer", "../renderer/row-drag-header-indent-render", "../base/string-literals"], function (require, exports, ej2_base_1, ej2_base_2, ej2_data_1, value_formatter_1, enum_1, data_1, column_1, row_1, cell_1, events, util_1, content_renderer_1, header_renderer_1, cell_renderer_1, header_cell_renderer_1, stacked_cell_renderer_1, indent_cell_renderer_1, caption_cell_renderer_1, expand_cell_renderer_1, header_indent_renderer_1, detail_header_indent_renderer_1, detail_expand_cell_renderer_1, row_drag_drop_renderer_1, row_drag_header_indent_render_1, literals) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var Render = (function () {
        function Render(parent, locator) {
            this.emptyGrid = false;
            this.counter = 0;
            this.parent = parent;
            this.locator = locator;
            this.data = new data_1.Data(parent, locator);
            this.l10n = locator.getService('localization');
            this.ariaService = this.locator.getService('ariaService');
            this.renderer = this.locator.getService('rendererFactory');
            this.addEventListener();
        }
        Render.prototype.render = function () {
            var gObj = this.parent;
            this.headerRenderer = this.renderer.getRenderer(enum_1.RenderType.Header);
            this.contentRenderer = this.renderer.getRenderer(enum_1.RenderType.Content);
            this.headerRenderer.renderPanel();
            this.contentRenderer.renderPanel();
            if (gObj.getColumns().length) {
                this.isLayoutRendered = true;
                this.headerRenderer.renderTable();
                this.contentRenderer.renderTable();
                this.emptyRow(false);
            }
            this.parent.scrollModule.setWidth();
            this.parent.scrollModule.setHeight();
            if (this.parent.height !== 'auto') {
                this.parent.scrollModule.setPadding();
            }
            this.refreshDataManager();
        };
        Render.prototype.refresh = function (e) {
            var _this = this;
            if (e === void 0) { e = { requestType: 'refresh' }; }
            var gObj = this.parent;
            gObj.notify(e.requestType + "-begin", e);
            gObj.trigger(events.actionBegin, e, function (args) {
                Iif (args === void 0) { args = { requestType: 'refresh' }; }
                if (args.cancel) {
                    gObj.notify(events.cancelBegin, args);
                    if (args.action === 'clearFilter' && _this.parent.filterSettings.type === 'Menu') {
                        _this.parent.filterSettings.columns[_this.parent.filterModule.filterObjIndex] = _this.parent.filterModule.prevFilterObject;
                        var iconClass = _this.parent.showColumnMenu && _this.parent.filterModule['column'].showColumnMenu ? '.e-columnmenu' : '.e-icon-filter';
                        var col = _this.parent.element.querySelector('[e-mappinguid="' + _this.parent.filterModule['column'].uid + '"]').parentElement;
                        var flIcon = col.querySelector(iconClass);
                        Eif (!ej2_base_2.isNullOrUndefined(_this.parent.filterModule.prevFilterObject)) {
                            flIcon.classList.add('e-filtered');
                        }
                    }
                    if (args.action === 'clear-filter' && (_this.parent.filterSettings.type === 'CheckBox' || _this.parent.filterSettings.type === 'Excel')) {
                        _this.parent.filterSettings.columns = _this.parent.filterModule.checkboxPrevFilterObject;
                    }
                    if (args.requestType === 'grouping') {
                        var index = gObj.groupSettings.columns.indexOf(args.columnName);
                        Eif (index !== -1) {
                            gObj.setProperties({ groupSettings: { Columns: gObj.groupSettings.columns.splice(index, 1) } }, true);
                            gObj.setProperties({ sortSettings: { Columns: gObj.sortSettings.columns.splice(index, 1) } }, true);
                            var column = gObj.getColumnByField(args.columnName);
                            var headerCell = gObj.getColumnHeaderByField(column.field);
                            column.visible = (!ej2_base_2.isNullOrUndefined(headerCell) && !headerCell.classList.contains('e-hide'));
                        }
                    }
                    return;
                }
                if (_this.parent.groupModule && args.preventFocusOnGroup) {
                    _this.parent.groupModule.preventFocusOnGroup = args.preventFocusOnGroup;
                }
                if (gObj.allowSelection && (args.action === 'clearFilter' || args.action === 'clear-filter' ||
                    (args.requestType === 'searching' && args.searchString === '') || args.action === 'add')) {
                    gObj.selectionModule['rmtHdrChkbxClicked'] = false;
                }
                if (gObj.allowPaging && gObj.pageSettings.pageSizes && gObj.pagerModule.pagerObj.isAllPage &&
                    (args.action === 'add' && args.requestType === 'save') && gObj.pagerModule.pagerObj.checkAll) {
                    gObj.setProperties({ pageSettings: { pageSize: gObj.pageSettings.pageSize + 1 } }, true);
                }
                if (args.requestType === 'delete' && gObj.allowPaging) {
                    var dataLength = args.data.length;
                    var count = gObj.pageSettings.totalRecordsCount - dataLength;
                    var currentViewData = gObj.getCurrentViewRecords().length;
                    if ((!(currentViewData - dataLength) && count && ((gObj.pageSettings.currentPage - 1) * gObj.pageSettings.pageSize) === count) || (count && count <= dataLength)) {
                        gObj.prevPageMoving = true;
                        gObj.setProperties({
                            pageSettings: {
                                totalRecordsCount: count, currentPage: Math.ceil(count / gObj.pageSettings.pageSize)
                            }
                        }, true);
                        gObj.pagerModule.pagerObj.totalRecordsCount = count;
                    }
                }
                if (args.requestType === 'reorder' && _this.parent.dataSource && 'result' in _this.parent.dataSource) {
                    _this.contentRenderer.refreshContentRows(args);
                }
                else if ((args.requestType === 'paging' || args.requestType === 'columnstate' || args.requestType === 'reorder')
                    && _this.parent.groupSettings.enableLazyLoading && _this.parent.groupSettings.columns.length
                    && (_this.parent.enableVirtualization ? _this.parent.lazyLoadRender :
                        _this.parent.contentModule).getGroupCache()[_this.parent.pageSettings.currentPage]) {
                    _this.contentRenderer.refreshContentRows(args);
                }
                else {
                    _this.refreshDataManager(args);
                }
            });
        };
        Render.prototype.resetTemplates = function () {
            var gObj = this.parent;
            var gridColumns = gObj.getColumns();
            Iif (gObj.detailTemplate) {
                var detailTemplateID = gObj.element.id + 'detailTemplate';
                ej2_base_1.blazorTemplates["" + detailTemplateID] = [];
                ej2_base_1.resetBlazorTemplate(detailTemplateID, 'DetailTemplate');
            }
            Iif (gObj.groupSettings.captionTemplate) {
                ej2_base_1.resetBlazorTemplate(gObj.element.id + 'captionTemplate', 'CaptionTemplate');
            }
            Iif (gObj.rowTemplate) {
                ej2_base_1.resetBlazorTemplate(gObj.element.id + 'rowTemplate', 'RowTemplate');
            }
            Iif (gObj.toolbarTemplate) {
                ej2_base_1.resetBlazorTemplate(gObj.element.id + 'toolbarTemplate', 'ToolbarTemplate');
            }
            Iif (gObj.pageSettings.template) {
                ej2_base_1.resetBlazorTemplate(gObj.element.id + '_template', 'pageSettings');
            }
            for (var i = 0; i < gridColumns.length; i++) {
                Iif (gridColumns[parseInt(i.toString(), 10)].template) {
                    ej2_base_1.blazorTemplates[gObj.element.id + gridColumns[parseInt(i.toString(), 10)].uid] = [];
                    ej2_base_1.resetBlazorTemplate(gObj.element.id + gridColumns[parseInt(i.toString(), 10)].uid, 'Template');
                }
                Iif (gridColumns[parseInt(i.toString(), 10)].headerTemplate) {
                    ej2_base_1.resetBlazorTemplate(gObj.element.id + gridColumns[parseInt(i.toString(), 10)].uid + 'headerTemplate', 'HeaderTemplate');
                }
                Iif (gridColumns[parseInt(i.toString(), 10)].filterTemplate) {
                    ej2_base_1.resetBlazorTemplate(gObj.element.id + gridColumns[parseInt(i.toString(), 10)].uid + 'filterTemplate', 'FilterTemplate');
                }
            }
            var guid = 'guid';
            for (var k = 0; k < gObj.aggregates.length; k++) {
                for (var j = 0; j < gObj.aggregates[parseInt(k.toString(), 10)].columns.length; j++) {
                    Iif (gObj.aggregates[parseInt(k.toString(), 10)].columns[parseInt(j.toString(), 10)].footerTemplate) {
                        var tempID = gObj.element.id + gObj.aggregates[parseInt(k.toString(), 10)].columns[parseInt(j.toString(), 10)]["" + guid] + 'footerTemplate';
                        ej2_base_1.resetBlazorTemplate(tempID, 'FooterTemplate');
                    }
                    Iif (gObj.aggregates[parseInt(k.toString(), 10)].columns[parseInt(j.toString(), 10)].groupFooterTemplate) {
                        var tempID = gObj.element.id + gObj.aggregates[parseInt(k.toString(), 10)].columns[parseInt(j.toString(), 10)]["" + guid] + 'groupFooterTemplate';
                        ej2_base_1.resetBlazorTemplate(tempID, 'GroupFooterTemplate');
                    }
                    Iif (gObj.aggregates[parseInt(k.toString(), 10)].columns[parseInt(j.toString(), 10)].groupCaptionTemplate) {
                        var tempID = gObj.element.id + gObj.aggregates[parseInt(k.toString(), 10)].columns[parseInt(j.toString(), 10)]["" + guid] + 'groupCaptionTemplate';
                        ej2_base_1.resetBlazorTemplate(tempID, 'GroupCaptionTemplate');
                    }
                }
            }
        };
        Render.prototype.refreshComplete = function (e) {
            this.parent.trigger(events.actionComplete, e);
        };
        Render.prototype.refreshDataManager = function (args) {
            var _this = this;
            if (args === void 0) { args = {}; }
            var gObj = this.parent;
            var maskRow = (gObj.loadingIndicator.indicatorType === 'Shimmer' && args.requestType !== 'virtualscroll'
                && args.requestType !== 'infiniteScroll') || ((args.requestType === 'virtualscroll' || args.requestType === 'infiniteScroll')
                && gObj.enableVirtualMaskRow);
            if (args.requestType !== 'virtualscroll' && !args.isCaptionCollapse && !maskRow) {
                this.parent.showSpinner();
            }
            if (maskRow) {
                gObj.showMaskRow(args.requestType === 'virtualscroll' ? args.virtualInfo.sentinelInfo.axis
                    : args.requestType === 'infiniteScroll' ? args.direction : undefined);
            }
            this.parent.notify(events.resetInfiniteBlocks, args);
            this.emptyGrid = false;
            var dataManager;
            var isFActon = this.isNeedForeignAction();
            this.ariaService.setBusy(this.parent.getContent().querySelector('.' + literals.content), true);
            if (isFActon) {
                var deffered = new ej2_data_1.Deferred();
                dataManager = this.getFData(deffered, args);
            }
            if (!dataManager) {
                if (gObj.allowPaging && !gObj.getDataModule().dataManager.dataSource.offline && gObj.pageSettings
                    && gObj.pageSettings.pageSizes && gObj.pagerModule && gObj.pagerModule.pagerObj && gObj.pagerModule.pagerObj.isAllPage) {
                    gObj.pagerModule.pagerObj.isAllPage = undefined;
                }
                dataManager = this.data.getData(args, this.data.generateQuery().requiresCount());
            }
            else {
                dataManager = dataManager.then(function (e) {
                    var query = _this.data.generateQuery().requiresCount();
                    if (_this.emptyGrid) {
                        var def = new ej2_data_1.Deferred();
                        def.resolve({ result: [], count: 0 });
                        return def.promise;
                    }
                    return _this.data.getData(args, query);
                });
            }
            var foreignKeyColumns = this.parent.getForeignKeyColumns();
            var foreignKeyLength = foreignKeyColumns.length;
            if (this.parent.columnQueryMode === 'ExcludeHidden' && foreignKeyLength) {
                foreignKeyLength = foreignKeyColumns.filter(function (col) { return col.visible !== false; }).length;
            }
            if (foreignKeyLength && (!isFActon || this.parent.searchSettings.key.length)) {
                var deffered_1 = new ej2_data_1.Deferred();
                dataManager = dataManager.then(function (e) {
                    _this.parent.notify(events.getForeignKeyData, { dataManager: dataManager, result: e, promise: deffered_1, action: args });
                    return deffered_1.promise;
                });
            }
            if (this.parent.groupSettings.disablePageWiseAggregates && this.parent.groupSettings.columns.length) {
                dataManager = dataManager.then(function (e) { return _this.validateGroupRecords(e); });
            }
            dataManager.then(function (e) { return _this.dataManagerSuccess(e, args); })
                .catch(function (e) { return _this.dataManagerFailure(e, args); });
        };
        Render.prototype.getFData = function (deferred, args) {
            this.parent.notify(events.getForeignKeyData, { isComplex: true, promise: deferred, action: args });
            return deferred.promise;
        };
        Render.prototype.isNeedForeignAction = function () {
            var gObj = this.parent;
            return !!((gObj.allowFiltering && gObj.filterSettings.columns.length) ||
                (!ej2_base_2.isNullOrUndefined(gObj.searchSettings.key) && gObj.searchSettings.key.length))
                && this.foreignKey(this.parent.getForeignKeyColumns());
        };
        Render.prototype.foreignKey = function (columns) {
            var _this = this;
            return columns.some(function (col) {
                var fbool = false;
                fbool = _this.parent.filterSettings.columns.some(function (value) {
                    return col.uid === value.uid;
                });
                return !!(fbool || _this.parent.searchSettings.key.length);
            });
        };
        Render.prototype.sendBulkRequest = function (args) {
            var _this = this;
            args.requestType = 'batchsave';
            var gObj = this.parent;
            if (gObj.allowPaging && gObj.pageSettings.pageSizes && gObj.pagerModule.pagerObj.isAllPage && gObj.pagerModule.pagerObj.checkAll) {
                var dataLength = args['changes'].addedRecords.length;
                Eif (dataLength) {
                    gObj.setProperties({ pageSettings: { pageSize: gObj.pageSettings.pageSize + dataLength } }, true);
                }
            }
            Iif (gObj.allowPaging && (args.changes.addedRecords.length ||
                args.changes.deletedRecords.length ||
                args.changes.changedRecords.length) && gObj.pageSettings
                && gObj.pageSettings.pageSizes && gObj.pagerModule && gObj.pagerModule.pagerObj
                && !gObj.getDataModule().dataManager.dataSource.offline && gObj.pagerModule.pagerObj.isAllPage) {
                gObj.pagerModule.pagerObj.isAllPage = undefined;
            }
            var promise = this.data.saveChanges(args.changes, this.parent.getPrimaryKeyFieldNames()[0], args.original);
            var query = this.data.generateQuery().requiresCount();
            Eif (this.data.dataManager.dataSource.offline) {
                this.refreshDataManager({ requestType: 'batchsave' });
                return;
            }
            else {
                promise.then(function (e) {
                    _this.data.getData(args, query)
                        .then(function (e) { return _this.dmSuccess(e, args); })
                        .catch(function (e) { return _this.dmFailure(e, args); });
                })
                    .catch(function (e) { return _this.dmFailure(e, args); });
            }
        };
        Render.prototype.dmSuccess = function (e, args) {
            this.dataManagerSuccess(e, args);
        };
        Render.prototype.dmFailure = function (e, args) {
            this.dataManagerFailure(e, args);
        };
        Render.prototype.renderEmptyRow = function () {
            this.emptyRow(true);
        };
        Render.prototype.emptyRow = function (isTrigger) {
            var gObj = this.parent;
            var tbody = this.contentRenderer.getTable().querySelector(literals.tbody);
            Eif (!ej2_base_2.isNullOrUndefined(tbody)) {
                ej2_base_1.remove(tbody);
            }
            tbody = this.parent.createElement(literals.tbody, { attrs: { role: 'rowgroup' } });
            var spanCount = gObj.allowRowDragAndDrop && ej2_base_2.isNullOrUndefined(gObj.rowDropSettings.targetID) ? 1 : 0;
            if (gObj.detailTemplate || gObj.childGrid) {
                ++spanCount;
            }
            var className = gObj.editSettings.showAddNewRow && gObj.editSettings.newRowPosition === 'Bottom' ?
                'e-emptyrow e-show-added-row' : 'e-emptyrow';
            var tr = this.parent.createElement('tr', { className: className, attrs: { role: 'row' } });
            var td;
            if (gObj.emptyRecordTemplate) {
                var emptyRecordTemplateID = gObj.element.id + 'emptyRecordTemplate';
                td = this.parent.createElement('td', { attrs: { colspan: (gObj.getVisibleColumns().length +
                            spanCount + gObj.groupSettings.columns.length).toString() } });
                Iif (gObj.isVue || (gObj.parentDetails && gObj.parentDetails.parentInstObj && gObj.parentDetails.parentInstObj.isVue)) {
                    td.appendChild(gObj.getEmptyRecordTemplate()(gObj.dataSource, gObj, 'emptyRecordTemplate', emptyRecordTemplateID, undefined, undefined, undefined, this.parent['root'])[1]);
                }
                else {
                    td.appendChild(gObj.getEmptyRecordTemplate()(gObj.dataSource, gObj, 'emptyRecordTemplate', emptyRecordTemplateID, undefined, undefined, undefined, this.parent['root'])[0]);
                }
                Iif (gObj.isReact) {
                    this.parent.renderTemplates();
                }
            }
            else {
                td = this.parent.createElement('td', {
                    innerHTML: this.l10n.getConstant('EmptyRecord'),
                    attrs: { colspan: (gObj.getVisibleColumns().length + spanCount + (!ej2_base_2.isNullOrUndefined(gObj.groupSettings.columns) ?
                            gObj.groupSettings.columns.length : 0)).toString() }
                });
            }
            if (gObj.isFrozenGrid()) {
                td.classList.add('e-leftfreeze');
                td.style.left = 0 + 'px';
            }
            if (gObj.frozenRows && gObj.element.querySelector('.e-frozenrow-border')) {
                this.parent.element.querySelector('.e-frozenrow-border').classList.add('e-frozenrow-empty');
            }
            tr.appendChild(td);
            tbody.appendChild(tr);
            this.contentRenderer.renderEmpty(tbody);
            if (isTrigger) {
                if (!this.parent.isInitialLoad) {
                    this.parent.focusModule.setFirstFocusableTabIndex();
                }
                this.parent.trigger(events.dataBound, {});
                this.parent.notify(events.onEmpty, { rows: [new row_1.Row({ isDataRow: true, cells: [new cell_1.Cell({ isDataCell: true, visible: true })] })] });
                Iif (gObj.editSettings.showAddNewRow) {
                    gObj.addRecord();
                    this.parent.notify(events.showAddNewRowFocus, {});
                }
            }
        };
        Render.prototype.dynamicColumnChange = function () {
            if (this.parent.getCurrentViewRecords().length) {
                this.updateColumnType(this.parent.getCurrentViewRecords()[0]);
            }
        };
        Render.prototype.updateColumnType = function (record) {
            var columns = this.parent.getColumns();
            var value;
            var cFormat = 'customFormat';
            var equalTo = 'equalTo';
            var data = record && record.items ? record.items[0] : record;
            var fmtr = this.locator.getService('valueFormatter');
            for (var i = 0, len = columns.length; i < len; i++) {
                value = util_1.getObject(columns[parseInt(i.toString(), 10)].field || '', data);
                Iif (!ej2_base_2.isNullOrUndefined(columns[parseInt(i.toString(), 10)]["" + cFormat])) {
                    columns[parseInt(i.toString(), 10)].format = columns[parseInt(i.toString(), 10)]["" + cFormat];
                }
                Iif (!ej2_base_2.isNullOrUndefined(columns[parseInt(i.toString(), 10)].validationRules)
                    && !ej2_base_2.isNullOrUndefined(columns[parseInt(i.toString(), 10)].validationRules["" + equalTo])) {
                    columns[parseInt(i.toString(), 10)].validationRules["" + equalTo][0] = this.parent.element.id + columns[parseInt(i.toString(), 10)].validationRules["" + equalTo][0];
                }
                if (columns[parseInt(i.toString(), 10)].isForeignColumn() && columns[parseInt(i.toString(), 10)].columnData) {
                    value = util_1.getObject(columns[parseInt(i.toString(), 10)].foreignKeyValue || '', columns[parseInt(i.toString(), 10)].columnData[0]);
                }
                if (!ej2_base_2.isNullOrUndefined(value)) {
                    this.isColTypeDef = true;
                    if (!columns[parseInt(i.toString(), 10)].type) {
                        columns[parseInt(i.toString(), 10)].type = value.getDay ? (value.getHours() > 0 || value.getMinutes() > 0 ||
                            value.getSeconds() > 0 || value.getMilliseconds() > 0 ? 'datetime' : 'date') : typeof (value);
                    }
                }
                else {
                    columns[parseInt(i.toString(), 10)].type = columns[parseInt(i.toString(), 10)].type || null;
                }
                var valueFormatter = new value_formatter_1.ValueFormatter();
                if (columns[parseInt(i.toString(), 10)].format && (columns[parseInt(i.toString(), 10)].format.skeleton
                    || (columns[parseInt(i.toString(), 10)].format.format &&
                        typeof columns[parseInt(i.toString(), 10)].format.format === 'string'))) {
                    columns[parseInt(i.toString(), 10)].setFormatter(valueFormatter.getFormatFunction(ej2_base_2.extend({}, columns[parseInt(i.toString(), 10)].format)));
                    columns[parseInt(i.toString(), 10)].setParser(valueFormatter.getParserFunction(columns[parseInt(i.toString(), 10)].format));
                }
                if (typeof (columns[parseInt(i.toString(), 10)].format) === 'string') {
                    util_1.setFormatter(this.locator, columns[parseInt(i.toString(), 10)]);
                }
                else if (!columns[parseInt(i.toString(), 10)].format && columns[parseInt(i.toString(), 10)].type === 'number') {
                    columns[parseInt(i.toString(), 10)].setParser(fmtr.getParserFunction({ format: 'n2' }));
                }
                if (columns[parseInt(i.toString(), 10)].type === 'dateonly' && !columns[parseInt(i.toString(), 10)].format) {
                    columns[parseInt(i.toString(), 10)].format = 'yMd';
                    util_1.setFormatter(this.locator, columns[parseInt(i.toString(), 10)]);
                }
            }
        };
        Render.prototype.dataManagerSuccess = function (e, args) {
            var _this = this;
            var gObj = this.parent;
            this.contentRenderer = this.renderer.getRenderer(enum_1.RenderType.Content);
            this.headerRenderer = this.renderer.getRenderer(enum_1.RenderType.Header);
            e.actionArgs = args;
            var isInfiniteDelete = this.parent.enableInfiniteScrolling && !this.parent.infiniteScrollSettings.enableCache &&
                !gObj.groupSettings.enableLazyLoading && (args.requestType === 'delete' || (args.requestType === 'save' &&
                this.parent.infiniteScrollModule.requestType === 'add' && !(gObj.sortSettings.columns.length ||
                gObj.filterSettings.columns.length || this.parent.groupSettings.columns.length || gObj.searchSettings.key)));
            gObj.trigger(events.beforeDataBound, e, function (dataArgs) {
                if (dataArgs.cancel) {
                    return;
                }
                dataArgs.result = ej2_base_2.isNullOrUndefined(dataArgs.result) ? [] : dataArgs.result;
                var len = Object.keys(dataArgs.result).length;
                Iif (_this.parent.isDestroyed) {
                    return;
                }
                Iif ((!gObj.getColumns().length && !len) && !(gObj.columns.length && gObj.columns[0] instanceof column_1.Column)) {
                    gObj.hideSpinner();
                    return;
                }
                Iif (_this.isInfiniteEnd(args) && !len) {
                    _this.parent.notify(events.infiniteEditHandler, { e: args, result: e.result, count: e.count, agg: e.aggregates });
                    return;
                }
                _this.parent.isEdit = false;
                _this.parent.notify(events.editReset, {});
                _this.parent.notify(events.tooltipDestroy, {});
                if (args && !((args.requestType === 'infiniteScroll' || args.requestType === 'delete' || args.action === 'add') &&
                    gObj.enableInfiniteScrolling)) {
                    _this.parent.notify(events.commandColumnDestroy, { type: 'refreshCommandColumn' });
                }
                _this.contentRenderer.prevCurrentView = !ej2_base_2.isNullOrUndefined(_this.parent.currentViewData) && _this.parent.currentViewData.slice();
                gObj.currentViewData = dataArgs.result;
                gObj.notify(events.refreshInfiniteCurrentViewData, { args: args, data: dataArgs.result });
                if (dataArgs.count && !gObj.allowPaging && (gObj.enableVirtualization || gObj.enableInfiniteScrolling)) {
                    gObj.totalDataRecordsCount = dataArgs.count;
                }
                if (!len && dataArgs.count && gObj.allowPaging && args && args.requestType !== 'delete') {
                    Iif (_this.parent.groupSettings.enableLazyLoading
                        && (args.requestType === 'grouping' || args.requestType === 'ungrouping')) {
                        _this.parent.notify(events.groupComplete, args);
                    }
                    gObj.prevPageMoving = true;
                    gObj.pageSettings.totalRecordsCount = dataArgs.count;
                    if (args.requestType !== 'paging') {
                        gObj.pageSettings.currentPage = Math.ceil(dataArgs.count / gObj.pageSettings.pageSize);
                    }
                    gObj.dataBind();
                    return;
                }
                if ((!gObj.getColumns().length && len || !_this.isLayoutRendered) && !util_1.isGroupAdaptive(gObj)) {
                    gObj.removeMaskRow();
                    _this.updatesOnInitialRender(dataArgs);
                }
                if (!_this.isColTypeDef && gObj.getCurrentViewRecords()) {
                    if (_this.data.dataManager.dataSource.offline && gObj.dataSource && gObj.dataSource.length) {
                        _this.updateColumnType(gObj.dataSource[0]);
                    }
                    else {
                        _this.updateColumnType(gObj.getCurrentViewRecords()[0]);
                    }
                }
                if (!_this.parent.isInitialLoad && _this.parent.groupSettings.disablePageWiseAggregates &&
                    !_this.parent.groupSettings.columns.length) {
                    dataArgs.result = _this.parent.dataSource instanceof Array ? _this.parent.dataSource : _this.parent.currentViewData;
                }
                if ((_this.parent.isReact || _this.parent.isVue) && !ej2_base_2.isNullOrUndefined(args) && args.requestType !== 'infiniteScroll' && !args.isFrozen) {
                    util_1.clearReactVueTemplates(_this.parent, ['footerTemplate']);
                }
                Iif (_this.parent.isAngular && _this.parent.allowGrouping && _this.parent.groupSettings.captionTemplate
                    && !(!ej2_base_2.isNullOrUndefined(args) && args.requestType === 'infiniteScroll')) {
                    _this.parent.destroyTemplate(['groupSettings_captionTemplate']);
                }
                _this.parent.notify(events.dataReady, ej2_base_2.extend({ count: dataArgs.count, result: dataArgs.result, aggregates: dataArgs.aggregates, loadSummaryOnEmpty: false }, args));
                if ((gObj.groupSettings.columns.length || (args && args.requestType === 'ungrouping'))
                    && (args && args.requestType !== 'filtering')) {
                    _this.headerRenderer.refreshUI();
                }
                if (len) {
                    if (util_1.isGroupAdaptive(gObj)) {
                        var content = 'content';
                        args.scrollTop = { top: _this.contentRenderer["" + content].scrollTop };
                    }
                    if (!isInfiniteDelete) {
                        if (_this.parent.enableImmutableMode) {
                            _this.contentRenderer.immutableModeRendering(args);
                        }
                        else {
                            _this.contentRenderer.refreshContentRows(args);
                        }
                    }
                    else {
                        _this.parent.notify(events.infiniteEditHandler, { e: args, result: e.result, count: e.count, agg: e.aggregates });
                    }
                }
                else {
                    Iif (args && args.isCaptionCollapse) {
                        return;
                    }
                    Iif (!gObj.getColumns().length) {
                        gObj.element.innerHTML = '';
                        alert(_this.l10n.getConstant('EmptyDataSourceError'));
                        return;
                    }
                    _this.contentRenderer.setRowElements([]);
                    _this.contentRenderer.setRowObjects([]);
                    _this.ariaService.setBusy(_this.parent.getContent().querySelector('.' + literals.content), false);
                    gObj.removeMaskRow();
                    _this.renderEmptyRow();
                    if (gObj.enableColumnVirtualization && !len) {
                        _this.parent.notify(events.contentReady, { rows: gObj.getRowsObject(), args: {} });
                    }
                    if (args) {
                        var action = (args.requestType || '').toLowerCase() + '-complete';
                        _this.parent.notify(action, args);
                        if (args.requestType === 'batchsave') {
                            args.cancel = false;
                            args.rows = [];
                            args.isFrozen = !args.isFrozen;
                            _this.parent.trigger(events.actionComplete, args);
                        }
                    }
                    Iif (_this.parent.autoFit) {
                        _this.parent.preventAdjustColumns();
                    }
                    _this.parent.hideSpinner();
                }
                _this.parent.notify(events.toolbarRefresh, {});
                _this.setRowCount(_this.parent.getCurrentViewRecords().length);
                if ('query' in e) {
                    _this.parent.getDataModule().isQueryInvokedFromData = false;
                }
            });
        };
        Render.prototype.dataManagerFailure = function (e, args) {
            if (!ej2_base_2.isNullOrUndefined(this.parent.contentModule)) {
                this.ariaService.setOptions(this.parent.getContent().querySelector('.' + literals.content), { busy: false, invalid: true });
                this.setRowCount(1);
            }
            this.parent.trigger(events.actionFailure, { error: e });
            this.parent.hideSpinner();
            this.parent.removeMaskRow();
            Iif (args.requestType === 'save' || args.requestType === 'delete'
                || args.name === 'bulk-save') {
                return;
            }
            this.parent.currentViewData = [];
            this.renderEmptyRow();
            Iif (!this.parent.isInitialLoad) {
                this.parent.focusModule.setFirstFocusableTabIndex();
            }
            this.parent.log('actionfailure', { error: e });
        };
        Render.prototype.setRowCount = function (dataRowCount) {
            this.ariaService.setOptions(this.parent.element, {
                rowcount: dataRowCount ? dataRowCount.toString() : '1'
            });
        };
        Render.prototype.isInfiniteEnd = function (args) {
            return this.parent.enableInfiniteScrolling && !this.parent.infiniteScrollSettings.enableCache && args.requestType === 'delete';
        };
        Render.prototype.updatesOnInitialRender = function (e) {
            this.isLayoutRendered = true;
            var isEmptyCol = false;
            Eif (this.parent.columns.length < 1) {
                this.buildColumns(e.result[0]);
                isEmptyCol = true;
            }
            util_1.prepareColumns(this.parent.columns, null, this.parent);
            Eif (isEmptyCol) {
                this.parent.notify(events.refreshSplitFrozenColumn, {});
            }
            this.headerRenderer.renderTable();
            this.contentRenderer.renderTable();
            this.parent.isAutoGen = true;
            this.parent.notify(events.autoCol, {});
        };
        Render.prototype.iterateComplexColumns = function (obj, field, split) {
            var keys = Object.keys(obj);
            for (var i = 0; i < keys.length; i++) {
                var childKeys = typeof obj[keys[parseInt(i.toString(), 10)]] === 'object'
                    && obj[keys[parseInt(i.toString(), 10)]] && !(obj[keys[parseInt(i.toString(), 10)]] instanceof Date) ?
                    Object.keys(obj[keys[parseInt(i.toString(), 10)]]) : [];
                if (childKeys.length) {
                    this.iterateComplexColumns(obj[keys[parseInt(i.toString(), 10)]], field + (keys[parseInt(i.toString(), 10)] + '.'), split);
                }
                else {
                    split[this.counter] = field + keys[parseInt(i.toString(), 10)];
                    this.counter++;
                }
            }
        };
        Render.prototype.buildColumns = function (record) {
            var cols = [];
            var complexCols = {};
            this.iterateComplexColumns(record, '', complexCols);
            var columns = Object.keys(complexCols).filter(function (e) { return complexCols["" + e] !== 'BlazId'; }).
                map(function (field) { return complexCols["" + field]; });
            for (var i = 0, len = columns.length; i < len; i++) {
                cols[parseInt(i.toString(), 10)] = { 'field': columns[parseInt(i.toString(), 10)] };
                if (this.parent.enableColumnVirtualization) {
                    cols[parseInt(i.toString(), 10)].width = !ej2_base_2.isNullOrUndefined(cols[parseInt(i.toString(), 10)].width) ?
                        cols[parseInt(i.toString(), 10)].width : 200;
                }
            }
            this.parent.setProperties({ 'columns': cols }, true);
        };
        Render.prototype.instantiateRenderer = function () {
            this.renderer.addRenderer(enum_1.RenderType.Header, new header_renderer_1.HeaderRender(this.parent, this.locator));
            this.renderer.addRenderer(enum_1.RenderType.Content, new content_renderer_1.ContentRender(this.parent, this.locator));
            var cellrender = this.locator.getService('cellRendererFactory');
            cellrender.addCellRenderer(enum_1.CellType.Header, new header_cell_renderer_1.HeaderCellRenderer(this.parent, this.locator));
            cellrender.addCellRenderer(enum_1.CellType.Data, new cell_renderer_1.CellRenderer(this.parent, this.locator));
            cellrender.addCellRenderer(enum_1.CellType.StackedHeader, new stacked_cell_renderer_1.StackedHeaderCellRenderer(this.parent, this.locator));
            cellrender.addCellRenderer(enum_1.CellType.Indent, new indent_cell_renderer_1.IndentCellRenderer(this.parent, this.locator));
            cellrender.addCellRenderer(enum_1.CellType.GroupCaption, new caption_cell_renderer_1.GroupCaptionCellRenderer(this.parent, this.locator));
            cellrender.addCellRenderer(enum_1.CellType.GroupCaptionEmpty, new caption_cell_renderer_1.GroupCaptionEmptyCellRenderer(this.parent, this.locator));
            cellrender.addCellRenderer(enum_1.CellType.Expand, new expand_cell_renderer_1.ExpandCellRenderer(this.parent, this.locator));
            cellrender.addCellRenderer(enum_1.CellType.HeaderIndent, new header_indent_renderer_1.HeaderIndentCellRenderer(this.parent, this.locator));
            cellrender.addCellRenderer(enum_1.CellType.StackedHeader, new stacked_cell_renderer_1.StackedHeaderCellRenderer(this.parent, this.locator));
            cellrender.addCellRenderer(enum_1.CellType.DetailHeader, new detail_header_indent_renderer_1.DetailHeaderIndentCellRenderer(this.parent, this.locator));
            cellrender.addCellRenderer(enum_1.CellType.RowDragHIcon, new row_drag_header_indent_render_1.RowDragDropHeaderRenderer(this.parent, this.locator));
            cellrender.addCellRenderer(enum_1.CellType.DetailExpand, new detail_expand_cell_renderer_1.DetailExpandCellRenderer(this.parent, this.locator));
            cellrender.addCellRenderer(enum_1.CellType.DetailFooterIntent, new indent_cell_renderer_1.IndentCellRenderer(this.parent, this.locator));
            cellrender.addCellRenderer(enum_1.CellType.RowDragIcon, new row_drag_drop_renderer_1.RowDragDropRenderer(this.parent, this.locator));
        };
        Render.prototype.addEventListener = function () {
            var _this = this;
            if (this.parent.isDestroyed) {
                return;
            }
            this.parent.on(events.initialLoad, this.instantiateRenderer, this);
            this.parent.on('refreshdataSource', this.dataManagerSuccess, this);
            this.parent.on(events.modelChanged, this.refresh, this);
            this.parent.on(events.refreshComplete, this.refreshComplete, this);
            this.parent.on(events.bulkSave, this.sendBulkRequest, this);
            this.parent.on(events.showEmptyGrid, function () { _this.emptyGrid = true; }, this);
            this.parent.on(events.autoCol, this.dynamicColumnChange, this);
        };
        Render.prototype.validateGroupRecords = function (e) {
            var _this = this;
            var index = e.result.length - 1;
            if (index < 0) {
                return Promise.resolve(e);
            }
            var group0 = e.result[0];
            var groupN = e.result[parseInt(index.toString(), 10)];
            var predicate = [];
            var addWhere = function (input) {
                var groups = [group0, groupN];
                for (var i = 0; i < groups.length; i++) {
                    predicate.push(new ej2_data_1.Predicate('field', '==', groups[parseInt(i.toString(), 10)].field).and(_this.getPredicate('key', 'equal', groups[parseInt(i.toString(), 10)].key)));
                }
                input.where(ej2_data_1.Predicate.or(predicate));
            };
            var query = new ej2_data_1.Query();
            addWhere(query);
            var curDm = new ej2_data_1.DataManager(e.result);
            var curFilter = curDm.executeLocal(query);
            var newQuery = this.data.generateQuery(true);
            var rPredicate = [];
            Iif (this.data.isRemote()) {
                var groups = [group0, groupN];
                for (var i = 0; i < groups.length; i++) {
                    rPredicate.push(this.getPredicate(groups[parseInt(i.toString(), 10)].field, 'equal', groups[parseInt(i.toString(), 10)].key));
                }
                newQuery.where(ej2_data_1.Predicate.or(rPredicate));
            }
            else {
                addWhere(newQuery);
            }
            var deferred = new ej2_data_1.Deferred();
            this.data.getData({}, newQuery).then(function (r) {
                _this.updateGroupInfo(curFilter, r.result);
                deferred.resolve(e);
            }).catch(function (e) { return deferred.reject(e); });
            return deferred.promise;
        };
        Render.prototype.getPredicate = function (key, operator, value) {
            if (value instanceof Date) {
                return util_1.getDatePredicate({ field: key, operator: operator, value: value });
            }
            return new ej2_data_1.Predicate(key, operator, value);
        };
        Render.prototype.updateGroupInfo = function (current, untouched) {
            var dm = new ej2_data_1.DataManager(untouched);
            var elements = current;
            for (var i = 0; i < elements.length; i++) {
                var updatedGroup = dm.executeLocal(new ej2_data_1.Query()
                    .where(new ej2_data_1.Predicate('field', '==', elements[parseInt(i.toString(), 10)].field).and(this.getPredicate('key', 'equal', elements[parseInt(i.toString(), 10)].key))))[0];
                Eif (!ej2_base_2.isNullOrUndefined(updatedGroup)) {
                    elements[parseInt(i.toString(), 10)].count = updatedGroup.count;
                    var itemGroup = elements[parseInt(i.toString(), 10)].items;
                    var updatedGroupItem = updatedGroup.items;
                    if (itemGroup.GroupGuid) {
                        elements[parseInt(i.toString(), 10)].items =
                            this.updateGroupInfo(elements[parseInt(i.toString(), 10)].items, updatedGroup.items);
                    }
                    var rows = this.parent.aggregates;
                    for (var j = 0; j < rows.length; j++) {
                        var row = rows[parseInt(j.toString(), 10)];
                        for (var k = 0; k < row.columns.length; k++) {
                            var column = row.columns[parseInt(k.toString(), 10)];
                            var types = column.type instanceof Array ? (column.type) : [(column.type)];
                            for (var l = 0; l < types.length; l++) {
                                var key = column.field + ' - ' + types[parseInt(l.toString(), 10)].toLowerCase();
                                var data = itemGroup.level ? updatedGroupItem.records : updatedGroup.items;
                                var context = this.parent;
                                Iif (types[parseInt(l.toString(), 10)] === 'Custom') {
                                    var data_2 = itemGroup.level ? updatedGroupItem : updatedGroup;
                                    var temp = column
                                        .customAggregate;
                                    if (typeof temp === 'string') {
                                        temp = ej2_base_1.getValue(temp, window);
                                    }
                                    elements[parseInt(i.toString(), 10)].aggregates["" + key] = temp ? temp.call(context, data_2, row.columns[parseInt(k.toString(), 10)]) : '';
                                }
                                else {
                                    elements[parseInt(i.toString(), 10)].aggregates["" + key] = ej2_data_1.DataUtil.aggregates[types[parseInt(l.toString(), 10)].toLowerCase()](data, row.columns[parseInt(k.toString(), 10)].field);
                                }
                            }
                        }
                    }
                }
            }
            return current;
        };
        return Render;
    }());
    exports.Render = Render;
});