| 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 | 1×
1×
1×
1×
158×
1×
66×
66×
66×
9×
57×
66×
66×
7×
7×
7×
66×
61×
5×
66×
66×
1×
125×
125×
125×
125×
125×
125×
1×
191×
191×
191×
191×
42×
191×
191×
191×
3×
3×
3×
188×
188×
188×
188×
188×
188×
188×
3×
188×
3×
188×
17×
17×
188×
188×
188×
188×
188×
188×
1247×
1247×
1247×
1247×
1247×
1207×
1207×
1207×
41×
1166×
19×
1207×
1×
1×
40×
1247×
118×
118×
8×
8×
118×
45×
2×
43×
2×
41×
2×
2×
1247×
1247×
1247×
1247×
188×
188×
188×
188×
188×
188×
1×
1×
3×
3×
3×
3×
3×
3×
1×
1×
| define(["require", "exports", "@syncfusion/ej2-base", "../base/util", "../base/string-literals"], function (require, exports, ej2_base_1, util_1, literals) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var InlineEditRender = (function () {
function InlineEditRender(parent) {
this.parent = parent;
}
InlineEditRender.prototype.addNew = function (elements, args) {
this.isEdit = false;
var tbody;
if ((this.parent.frozenRows || ((this.parent.enableVirtualization || this.parent.enableInfiniteScrolling) &&
this.parent.editSettings.showAddNewRow)) && this.parent.editSettings.newRowPosition === 'Top') {
tbody = this.parent.getHeaderTable().querySelector(literals.tbody);
}
else {
tbody = this.parent.getContentTable().querySelector(literals.tbody);
}
args.row = this.parent.createElement('tr', { className: 'e-row e-addedrow' });
if (this.parent.getContentTable().querySelector('.e-emptyrow') && !this.parent.editSettings.showAddNewRow) {
var emptyRow = this.parent.getContentTable().querySelector('.e-emptyrow');
emptyRow.parentNode.removeChild(emptyRow);
Iif (this.parent.frozenRows && this.parent.element.querySelector('.e-frozenrow-empty')) {
this.parent.element.querySelector('.e-frozenrow-empty').classList.remove('e-frozenrow-empty');
}
}
if (this.parent.editSettings.newRowPosition === 'Top') {
tbody.insertBefore(args.row, tbody.firstChild);
}
else {
tbody.appendChild(args.row);
}
args.row.appendChild(this.getEditElement(elements, false, undefined, args, true));
this.parent.editModule.checkLastRow(args.row, args);
};
InlineEditRender.prototype.update = function (elements, args) {
this.isEdit = true;
var tdElement = [].slice.call(args.row.querySelectorAll('td.e-rowcell'));
args.row.innerHTML = '';
args.row.appendChild(this.getEditElement(elements, true, tdElement, args, true));
args.row.classList.add(literals.editedRow);
this.parent.editModule.checkLastRow(args.row, args);
};
InlineEditRender.prototype.getEditElement = function (elements, isEdit, tdElement, args, isFrozen) {
var gObj = this.parent;
var gLen = 0;
var isDetail = !ej2_base_1.isNullOrUndefined(gObj.detailTemplate) || !ej2_base_1.isNullOrUndefined(gObj.childGrid) ? 1 : 0;
if (gObj.allowGrouping) {
gLen = gObj.groupSettings.columns.length;
}
var td = this.parent.createElement('td', {
className: 'e-editcell e-normaledit',
attrs: {
colspan: (gObj.getCurrentVisibleColumns(this.parent.enableColumnVirtualization).length +
this.parent.getIndentCount()).toString()
}
});
var form = args.form =
this.parent.createElement('form', { id: gObj.element.id + 'EditForm', className: 'e-gridform' });
if (this.parent.editSettings.template) {
this.appendChildren(form, args.rowData, isFrozen);
td.appendChild(form);
return td;
}
var table = this.parent.createElement('table', { className: 'e-table e-inline-edit', attrs: { cellspacing: '0.25', role: 'grid' } });
table.appendChild(gObj.getContentTable().querySelector(literals.colGroup).cloneNode(true));
var tbody = this.parent.createElement(literals.tbody, { attrs: { role: 'rowgroup' } });
var tr = this.parent.createElement('tr');
Iif (this.parent.rowHeight) {
tr.style.height = this.parent.rowHeight + 'px';
}
var i = 0;
if (isDetail) {
tr.insertBefore(this.parent.createElement('td', { className: 'e-detailrowcollapse' }), tr.firstChild);
}
if (gObj.isRowDragable()) {
tr.appendChild(this.parent.createElement('td', { className: 'e-dragindentcell' }));
}
while (i < gLen) {
tr.appendChild(this.parent.createElement('td', { className: 'e-indentcell' }));
i++;
}
var m = 0;
i = 0;
var inputValue;
var isFirstVisibleCell = true;
var cols = args.isCustomFormValidation ? this.parent.columnModel : gObj.getColumns();
while ((isEdit && m < tdElement.length && i < cols.length) || i < cols.length) {
var span = isEdit && tdElement[parseInt(m.toString(), 10)] ?
tdElement[parseInt(m.toString(), 10)].getAttribute('colspan') : null;
var col = cols[parseInt(i.toString(), 10)];
inputValue = (elements[col.uid]).value;
var td_1 = this.parent.createElement('td', {
className: literals.rowCell, attrs: { style: 'text-align:' + (col.textAlign ? col.textAlign : ''), 'colspan': span ? span : '' }
});
if (col.visible) {
td_1.appendChild(elements[col.uid]);
Iif (this.parent.rowRenderingMode === 'Vertical') {
util_1.setStyleAndAttributes(td_1, { 'data-cell': col.headerText });
if (i === 0) {
td_1.classList.add('e-responsive-editcell');
}
}
if (col.editType === 'booleanedit') {
td_1.classList.add('e-boolcell');
}
else if (col.commands || col.commandsTemplate) {
ej2_base_1.addClass([td_1], 'e-unboundcell');
}
if (!this.parent.enableRtl && (gObj.gridLines === 'Vertical' || gObj.gridLines === 'Both') &&
gLen && isFirstVisibleCell) {
td_1.classList.add('e-grid-group-first-cell');
isFirstVisibleCell = false;
}
}
else {
td_1.classList.add('e-hide');
}
if (this.parent.isFrozenGrid()) {
util_1.addStickyColumnPosition(this.parent, col, td_1);
if (this.parent.isSpan) {
var colSpan = td_1.getAttribute('colspan') ? parseInt(td_1.getAttribute('colspan'), 10) : 1;
util_1.resetColandRowSpanStickyPosition(this.parent, col, td_1, colSpan);
}
if (this.parent.enableColumnVirtualization) {
if (col.freeze === 'Left' && !ej2_base_1.isNullOrUndefined(col.valueX)) {
td_1.style.left = (col.valueX - this.parent.translateX) + 'px';
}
else if (col.freeze === 'Right' && !ej2_base_1.isNullOrUndefined(col.valueX)) {
td_1.style.right = (col.valueX + this.parent.translateX) + 'px';
}
else if (col.freeze === 'Fixed') {
td_1.style.left = (this.parent.leftrightColumnWidth('left') - this.parent.translateX) + 'px';
td_1.style.right = (this.parent.leftrightColumnWidth('right') + this.parent.translateX) + 'px';
}
}
}
td_1.setAttribute('aria-label', inputValue + this.parent.localeObj.getConstant('ColumnHeader') + col.headerText);
tr.appendChild(td_1);
i = span ? i + parseInt(span, 10) : i + 1;
m++;
}
util_1.addFixedColumnBorder(tr);
tbody.appendChild(tr);
table.appendChild(tbody);
form.appendChild(table);
td.appendChild(form);
return td;
};
InlineEditRender.prototype.removeEventListener = function () {
};
InlineEditRender.prototype.appendChildren = function (form, data, isFrozen) {
var _this = this;
var dummyData = ej2_base_1.extend({}, data, { isAdd: !this.isEdit, isFrozen: isFrozen }, true);
var editTemplateID = this.parent.element.id + 'editSettingsTemplate';
Iif (this.parent.isReact && typeof (this.parent.editSettings.template) !== 'string' &&
!(this.parent.editSettings.template.prototype &&
this.parent.editSettings.template.prototype.CSPTemplate)) {
this.parent.getEditTemplate()(dummyData, this.parent, 'editSettingsTemplate', editTemplateID, null, null, form);
this.parent.renderTemplates();
}
else {
util_1.appendChildren(form, this.parent.getEditTemplate()(dummyData, this.parent, 'editSettingsTemplate', editTemplateID, null, null, null, this.parent.root));
}
var setRules = function () {
var cols = _this.parent.getColumns();
for (var i = 0; i < cols.length; i++) {
if (cols[parseInt(i.toString(), 10)].validationRules) {
_this.parent.editModule.formObj.rules[cols[parseInt(i.toString(), 10)].field] =
cols[parseInt(i.toString(), 10)].validationRules;
}
}
};
};
return InlineEditRender;
}());
exports.InlineEditRender = InlineEditRender;
});
|