all files / grid/renderer/ edit-renderer.js

97.54% Statements 119/122
88.68% Branches 94/106
100% Functions 10/10
97.52% Lines 118/121
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   286×       286× 286× 286× 286×   72× 72×   332× 332× 332× 294× 294×     366× 366× 366× 366× 366×       366× 366× 1248× 1248× 68× 68× 68×       68×   68×   1180× 46×   1134× 1134× 1134× 1134× 1115×           1114×         1115× 359× 359×         359× 359×   359× 187×     172× 172× 172×     131×     41×     359× 297×     405× 405× 405× 405× 38×   405×   397× 1583× 1583× 19× 19× 19× 19× 95× 19× 19× 19× 19× 19×   1564×   1564× 1564× 1564× 1564× 1564×                   1558×     1557×   1558×   1558× 1558× 1558×       1558× 1558× 145×   1558×   157×     1564×   397×   368×        
define(["require", "exports", "@syncfusion/ej2-base", "./inline-edit-renderer", "./batch-edit-renderer", "./dialog-edit-renderer", "@syncfusion/ej2-base", "../base/enum", "../services/row-model-generator", "../base/util", "../base/constant", "../base/string-literals"], function (require, exports, ej2_base_1, inline_edit_renderer_1, batch_edit_renderer_1, dialog_edit_renderer_1, ej2_base_2, enum_1, row_model_generator_1, util_1, events, literals) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var EditRender = (function () {
        function EditRender(parent, serviceLocator) {
            this.editType = {
                'Inline': inline_edit_renderer_1.InlineEditRender,
                'Normal': inline_edit_renderer_1.InlineEditRender, 'Batch': batch_edit_renderer_1.BatchEditRender, 'Dialog': dialog_edit_renderer_1.DialogEditRender
            };
            this.parent = parent;
            this.serviceLocator = serviceLocator;
            this.renderer = new this.editType[this.parent.editSettings.mode](parent, serviceLocator);
            this.focus = serviceLocator.getService('focus');
        }
        EditRender.prototype.addNew = function (args) {
            this.renderer.addNew(this.getEditElements(args), args);
            this.convertWidget(args);
        };
        EditRender.prototype.update = function (args) {
            this.renderer.update(this.getEditElements(args), args);
            var isCustomFormValidation = args.isCustomFormValidation;
            if (!isCustomFormValidation) {
                this.parent.notify(events.beforeStartEdit, args);
                this.convertWidget(args);
            }
        };
        EditRender.prototype.convertWidget = function (args) {
            var gObj = this.parent;
            var isFocused;
            var cell;
            var value;
            var form = gObj.editSettings.mode === 'Dialog' ?
                ej2_base_2.select('#' + gObj.element.id + '_dialogEdit_wrapper .e-gridform', document) : gObj.editSettings.showAddNewRow &&
                gObj.element.querySelector('.e-editedrow') ? gObj.element.querySelector('.e-editedrow').getElementsByClassName('e-gridform')[0]
                : gObj.element.getElementsByClassName('e-gridform')[0];
            var cols = gObj.editSettings.mode !== 'Batch' ? gObj.getColumns() : [gObj.getColumnByField(args.columnName)];
            for (var _i = 0, cols_1 = cols; _i < cols_1.length; _i++) {
                var col = cols_1[_i];
                if (this.parent.editSettings.template && !ej2_base_1.isNullOrUndefined(col.field)) {
                    var cellArgs = ej2_base_1.extend({}, args);
                    cellArgs.element = form.querySelector('[name=' + util_1.getComplexFieldID(col.field) + ']');
                    Iif (typeof col.edit.write === 'string') {
                        util_1.getObject(col.edit.write, window)(cellArgs);
                    }
                    else {
                        col.edit.write(cellArgs);
                    }
                    continue;
                }
                if (this.parent.editModule.checkColumnIsGrouped(col) || col.commands) {
                    continue;
                }
                value = (col.valueAccessor(col.field, args.rowData, col));
                cell = form.querySelector('[e-mappinguid=' + col.uid + ']');
                var temp = col.edit.write;
                if (!ej2_base_1.isNullOrUndefined(cell)) {
                    if (typeof temp === 'string') {
                        temp = util_1.getObject(temp, window);
                        temp({
                            rowData: args.rowData, element: cell, column: col, requestType: args.requestType, row: args.row,
                            foreignKeyData: col.isForeignColumn() && util_1.getObject(col.field, args.foreignKeyData)
                        });
                    }
                    else {
                        col.edit.write({
                            rowData: args.rowData, element: cell, column: col, requestType: args.requestType, row: args.row,
                            foreignKeyData: col.isForeignColumn() && util_1.getObject(col.field, args.foreignKeyData)
                        });
                    }
                    if (!isFocused && ej2_base_1.isNullOrUndefined(cell.getAttribute('disabled')) && !util_1.parentsUntil(cell, 'e-checkbox-disabled')) {
                        this.focusElement(cell, args.type);
                        isFocused = true;
                    }
                }
            }
        };
        EditRender.prototype.focusElement = function (elem, type) {
            var chkBox = this.parent.element.querySelector('.e-edit-checkselect');
            if (!ej2_base_1.isNullOrUndefined(chkBox) && chkBox.nextElementSibling) {
                chkBox.nextElementSibling.classList.add('e-focus');
            }
            if (this.parent.editSettings.mode === 'Batch') {
                this.focus.onClick({ target: ej2_base_1.closest(elem, 'td') }, true);
            }
            else {
                var isFocus = (this.parent.enableVirtualization || this.parent.enableColumnVirtualization) && this.parent.editSettings.mode === 'Normal' ? false : true;
                var focusElement = elem.classList.contains('e-dropdownlist') ? elem.parentElement : elem;
                if ((isFocus || ((this.parent.enableVirtualization || this.parent.enableColumnVirtualization) && this.parent.editSettings.newRowPosition === 'Bottom'
                    && util_1.parentsUntil(elem, literals.addedRow))) && (!this.parent.editSettings.showAddNewRow ||
                    (this.parent.editSettings.showAddNewRow && (!util_1.parentsUntil(elem, literals.addedRow)) || this.parent.addNewRowFocus))) {
                    focusElement.focus();
                }
                else {
                    focusElement.focus({ preventScroll: true });
                }
            }
            if (elem.classList.contains('e-defaultcell')) {
                elem.setSelectionRange(elem.value.length, elem.value.length);
            }
        };
        EditRender.prototype.getEditElements = function (args) {
            var gObj = this.parent;
            var elements = {};
            var cols = gObj.editSettings.mode !== 'Batch' ? gObj.getColumns() : [gObj.getColumnByField(args.columnName)];
            if (args.isCustomFormValidation) {
                cols = this.parent.columnModel;
            }
            if (this.parent.editSettings.template) {
                return {};
            }
            for (var i = 0, len = cols.length; i < len; i++) {
                var col = cols[parseInt(i.toString(), 10)];
                if (col.commands || col.commandsTemplate) {
                    var cellRendererFact = this.serviceLocator.getService('cellRendererFactory');
                    var model = new row_model_generator_1.RowModelGenerator(this.parent);
                    var cellRenderer = cellRendererFact.getCellRenderer(enum_1.CellType.CommandColumn);
                    var cells = model.generateRows(args.rowData)[0].cells;
                    var cell = cells.filter(function (cell) { return cell.rowID; });
                    var td = cellRenderer.render(cell[parseInt(i.toString(), 10)], args.rowData, { 'index': args.row ? args.row.getAttribute(literals.dataRowIndex) : 0 }, this.parent.enableVirtualization);
                    var div = td.firstElementChild;
                    div.setAttribute('textAlign', td.getAttribute('textAlign'));
                    elements[col.uid] = div;
                    continue;
                }
                if (col.type === 'dateonly' && args.rowData[col.field] instanceof Date) {
                    var cellValue = args.rowData[col.field];
                    args.rowData[col.field] = cellValue.getFullYear() + '-' + util_1.padZero(cellValue.getMonth() + 1) + '-' + util_1.padZero(cellValue.getDate());
                }
                var value = (col.valueAccessor(col.field, args.rowData, col));
                var tArgs = { column: col, value: value, type: args.requestType, data: args.rowData };
                var temp = col.edit.create;
                var input = void 0;
                if (col.editTemplate) {
                    input = this.parent.createElement('span', { attrs: { 'e-mappinguid': col.uid } });
                    var tempID = this.parent.element.id + col.uid + 'editTemplate';
                    var tempData = util_1.extendObjWithFn({}, args.rowData, { column: col });
                    var isReactCompiler = this.parent.isReact && typeof (col.editTemplate) !== 'string' &&
                        !(col.editTemplate.prototype && col.editTemplate.prototype.CSPTemplate);
                    var isReactChild = this.parent.parentDetails && this.parent.parentDetails.parentInstObj &&
                        this.parent.parentDetails.parentInstObj.isReact;
                    Iif (isReactCompiler || isReactChild) {
                        col.getEditTemplate()(ej2_base_1.extend({ 'index': args.rowIndex }, tempData), this.parent, 'editTemplate', tempID, null, null, input);
                        this.parent.renderTemplates();
                    }
                    else {
                        var template = col.getEditTemplate()(ej2_base_1.extend({ 'index': args.rowIndex }, tempData), this.parent, 'editTemplate', tempID, null, null, null, gObj.root);
                        util_1.appendChildren(input, template);
                    }
                }
                else {
                    if (typeof temp === 'string') {
                        temp = util_1.getObject(temp, window);
                        input = temp(tArgs);
                    }
                    else {
                        input = col.edit.create(tArgs);
                    }
                    if (typeof input === 'string') {
                        var div = this.parent.createElement('div');
                        div.innerHTML = input;
                        input = div.firstChild;
                    }
                    var isInput = input.tagName !== 'input' && input.querySelectorAll('input').length;
                    var complexFieldName = util_1.getComplexFieldID(col.field);
                    ej2_base_2.attributes(isInput ? input.querySelector('input') : input, {
                        name: complexFieldName, 'e-mappinguid': col.uid,
                        id: gObj.element.id + complexFieldName
                    });
                    ej2_base_2.classList(input, ['e-input', 'e-field'], []);
                    if (col.textAlign === 'Right') {
                        input.classList.add('e-ralign');
                    }
                    if ((col.isPrimaryKey || col.isIdentity) && args.requestType === 'beginEdit' ||
                        (col.isIdentity && args.requestType === 'add')) {
                        input.setAttribute('disabled', '');
                    }
                }
                elements[col.uid] = input;
            }
            return elements;
        };
        EditRender.prototype.destroy = function () {
            this.renderer.removeEventListener();
        };
        return EditRender;
    }());
    exports.EditRender = EditRender;
});