@refinitiv-ui/efx-grid 6.0.16 → 6.0.17
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/grid/index.js +1 -1
- package/lib/tr-grid-column-grouping/es6/ColumnGrouping.d.ts +4 -4
- package/lib/tr-grid-column-grouping/es6/ColumnGrouping.js +271 -141
- package/lib/tr-grid-column-stack/es6/ColumnStack.d.ts +7 -1
- package/lib/tr-grid-column-stack/es6/ColumnStack.js +167 -146
- package/lib/tr-grid-in-cell-editing/es6/InCellEditing.d.ts +44 -43
- package/lib/tr-grid-in-cell-editing/es6/InCellEditing.js +202 -497
- package/lib/tr-grid-row-grouping/es6/RowGrouping.d.ts +40 -40
- package/lib/types/es6/ColumnStack.d.ts +7 -1
- package/lib/types/es6/Core/data/Segment.d.ts +3 -3
- package/lib/types/es6/Core/data/SegmentCollection.d.ts +1 -1
- package/lib/types/es6/InCellEditing.d.ts +44 -43
- package/lib/types/es6/RealtimeGrid/ColumnDefinition.d.ts +10 -0
- package/lib/types/es6/RealtimeGrid/FieldDefinition.d.ts +6 -0
- package/lib/types/es6/RealtimeGrid/Grid.d.ts +2 -0
- package/lib/types/es6/RealtimeGrid/RowDefinition.d.ts +4 -0
- package/lib/types/es6/RealtimeGrid/SnapshotFiller.d.ts +1 -0
- package/lib/types/es6/RowColoring.d.ts +17 -15
- package/lib/types/es6/RowFiltering.d.ts +30 -29
- package/lib/types/es6/RowGrouping.d.ts +40 -40
- package/lib/versions.json +4 -4
- package/package.json +1 -1
@@ -6,6 +6,7 @@ import { ElfUtil } from "../../tr-grid-util/es6/ElfUtil.js";
|
|
6
6
|
import { isTouchDevice, injectCss, prettifyCss } from "../../tr-grid-util/es6/Util.js";
|
7
7
|
import { ElfDate } from "../../tr-grid-util/es6/ElfDate.js";
|
8
8
|
import { CoralItems } from "../../tr-grid-util/es6/CoralItems.js";
|
9
|
+
|
9
10
|
/** @typedef {Object} InCellEditingPlugin~Options
|
10
11
|
* @description InCellEditingPlugin options that can be specified from `inCellEditing` property of the main grid's options
|
11
12
|
* @property {boolean=} balloonMode=false Show editor in a balloon. This is useful when there is not much space in the cell
|
@@ -42,6 +43,7 @@ import { CoralItems } from "../../tr-grid-util/es6/CoralItems.js";
|
|
42
43
|
* @description Editor options specified through `inCellEditing` property on the column configuration object
|
43
44
|
* @property {string=} type="text" Specify type of the editor. Available types are text, number, dropdown, date, checkbox, and combobox.
|
44
45
|
* @property {Array=} entries=null Specify list of items available in the dropdown box
|
46
|
+
* @property {Object=} attributes=null Specify attribute of input element
|
45
47
|
*/
|
46
48
|
|
47
49
|
/** @typedef {Object} InCellEditingPlugin~ColumnOptions
|
@@ -145,7 +147,6 @@ import { CoralItems } from "../../tr-grid-util/es6/CoralItems.js";
|
|
145
147
|
* @param {InCellEditingPlugin~Options=} options
|
146
148
|
* @extends {GridPlugin}
|
147
149
|
*/
|
148
|
-
|
149
150
|
var InCellEditingPlugin = function InCellEditingPlugin(options) {
|
150
151
|
var t = this;
|
151
152
|
t._onDoubleClick = t._onDoubleClick.bind(t);
|
@@ -162,20 +163,18 @@ var InCellEditingPlugin = function InCellEditingPlugin(options) {
|
|
162
163
|
t._onValueChanged = t._onValueChanged.bind(t);
|
163
164
|
t._onAutoSuggestItemSelected = t._onAutoSuggestItemSelected.bind(t);
|
164
165
|
t._hosts = [];
|
165
|
-
|
166
166
|
if (options) {
|
167
167
|
this.config({
|
168
168
|
"inCellEditing": options
|
169
169
|
});
|
170
170
|
}
|
171
171
|
};
|
172
|
-
|
173
172
|
Ext.inherits(InCellEditingPlugin, GridPlugin);
|
173
|
+
|
174
174
|
/** @type {Object}
|
175
175
|
* @private
|
176
176
|
* @static
|
177
177
|
*/
|
178
|
-
|
179
178
|
InCellEditingPlugin._uiElementTypesMap = {
|
180
179
|
"input": "input",
|
181
180
|
"text": "input",
|
@@ -187,209 +186,197 @@ InCellEditingPlugin._uiElementTypesMap = {
|
|
187
186
|
"boolean": "ef-checkbox",
|
188
187
|
"combobox": "ef-combo-box"
|
189
188
|
};
|
189
|
+
|
190
190
|
/** @type {boolean}
|
191
191
|
* @private
|
192
192
|
*/
|
193
|
-
|
194
193
|
InCellEditingPlugin.prototype._editableTitle = false;
|
195
194
|
/** @type {boolean}
|
196
195
|
* @private
|
197
196
|
*/
|
198
|
-
|
199
197
|
InCellEditingPlugin.prototype._editableContent = false;
|
198
|
+
|
200
199
|
/** Position of text editor is active.
|
201
200
|
* @type {Object}
|
202
201
|
* @private
|
203
202
|
*/
|
204
|
-
|
205
203
|
InCellEditingPlugin.prototype._activePos = null;
|
204
|
+
|
206
205
|
/** Where the cell was user double-cliked.
|
207
206
|
* @type {Object}
|
208
207
|
* @private
|
209
208
|
*/
|
210
|
-
|
211
209
|
InCellEditingPlugin.prototype._activeCell = null;
|
210
|
+
|
212
211
|
/** row id that editor placed
|
213
212
|
* @type {string}
|
214
213
|
* @private
|
215
214
|
*/
|
216
|
-
|
217
215
|
InCellEditingPlugin.prototype._activeRowId = "";
|
216
|
+
|
218
217
|
/** Previous core grid object that editor open.
|
219
218
|
* @type {Object}
|
220
219
|
* @private
|
221
220
|
*/
|
222
|
-
|
223
221
|
InCellEditingPlugin.prototype._lastActiveGrid = null;
|
222
|
+
|
224
223
|
/** Previous content cell before user editited, use to rollback when user cancelled.
|
225
224
|
* @type {*}
|
226
225
|
* @private
|
227
226
|
*/
|
228
|
-
|
229
227
|
InCellEditingPlugin.prototype._prevContent = null;
|
228
|
+
|
230
229
|
/** @type {string}
|
231
230
|
* @private
|
232
231
|
*/
|
233
|
-
|
234
232
|
InCellEditingPlugin.prototype._initialText = "";
|
233
|
+
|
235
234
|
/** @type {!InCellEditingPlugin~Cache}
|
236
235
|
* @private
|
237
236
|
*/
|
238
|
-
|
239
237
|
InCellEditingPlugin.prototype._headerInCellCache = null;
|
238
|
+
|
240
239
|
/** @type {!InCellEditingPlugin~Cache}
|
241
240
|
* @private
|
242
241
|
*/
|
243
|
-
|
244
242
|
InCellEditingPlugin.prototype._activeInCellCache = null;
|
243
|
+
|
245
244
|
/** @type {boolean}
|
246
245
|
* @private
|
247
246
|
*/
|
248
|
-
|
249
247
|
InCellEditingPlugin.prototype._usingBalloon = false;
|
248
|
+
|
250
249
|
/** @type {boolean}
|
251
250
|
* @private
|
252
251
|
*/
|
253
|
-
|
254
252
|
InCellEditingPlugin.prototype._balloonMode = false;
|
253
|
+
|
255
254
|
/** @type {boolean}
|
256
255
|
* @private
|
257
256
|
*/
|
258
|
-
|
259
257
|
InCellEditingPlugin.prototype._dataBinding = true;
|
258
|
+
|
260
259
|
/** @type {boolean}
|
261
260
|
* @private
|
262
261
|
*/
|
263
|
-
|
264
262
|
InCellEditingPlugin.prototype._dblClick = true;
|
263
|
+
|
265
264
|
/** @type {boolean}
|
266
265
|
* @private
|
267
266
|
*/
|
268
|
-
|
269
267
|
InCellEditingPlugin.prototype._autoCommitText = false;
|
268
|
+
|
270
269
|
/** @type {number}
|
271
270
|
* @private
|
272
271
|
*/
|
273
|
-
|
274
272
|
InCellEditingPlugin.prototype._touchTimerId = 0;
|
273
|
+
|
275
274
|
/** @type {number}
|
276
275
|
* @private
|
277
276
|
*/
|
278
|
-
|
279
277
|
InCellEditingPlugin.prototype._longPressTime = 1000; // For touch screen
|
280
278
|
|
281
279
|
/** @type {boolean}
|
282
280
|
* @private
|
283
281
|
*/
|
284
|
-
|
285
282
|
InCellEditingPlugin.prototype._editing = false;
|
283
|
+
|
286
284
|
/** Where other element stored.
|
287
285
|
* @type {Element}
|
288
286
|
* @private
|
289
287
|
*/
|
290
|
-
|
291
288
|
InCellEditingPlugin.prototype._customElement = null;
|
289
|
+
|
292
290
|
/** Popup element where custom element stored.
|
293
291
|
* @type {Popup}
|
294
292
|
* @private
|
295
293
|
*/
|
296
|
-
|
297
294
|
InCellEditingPlugin.prototype._customElementPopup = null;
|
298
295
|
/** @type {Number}
|
299
296
|
* @private
|
300
297
|
*/
|
301
|
-
|
302
298
|
InCellEditingPlugin.prototype._tabToMove = false;
|
303
299
|
/** @type {string}
|
304
300
|
* @private
|
305
301
|
*/
|
306
|
-
|
307
302
|
InCellEditingPlugin.prototype._contentSource = "textContent";
|
308
303
|
/** @type {boolean}
|
309
304
|
* @private
|
310
305
|
*/
|
311
|
-
|
312
306
|
InCellEditingPlugin.prototype._inlineStyling = false;
|
313
307
|
/** @type {boolean}
|
314
308
|
* @private
|
315
309
|
*/
|
316
|
-
|
317
310
|
InCellEditingPlugin.prototype._disablingScroll = false;
|
318
311
|
/** @type {boolean}
|
319
312
|
* @private
|
320
313
|
*/
|
321
|
-
|
322
314
|
InCellEditingPlugin.prototype._uiBlocking = false;
|
323
315
|
/** @type {Element}
|
324
316
|
* @private
|
325
317
|
*/
|
326
|
-
|
327
318
|
InCellEditingPlugin.prototype._autoSuggest = null;
|
328
319
|
/** @type {string}
|
329
320
|
* @private
|
330
321
|
*/
|
331
|
-
|
332
322
|
InCellEditingPlugin.prototype._defaultTag = "input";
|
333
323
|
/** status to show that row is closing
|
334
324
|
* @type {boolean}
|
335
325
|
* @private
|
336
326
|
*/
|
337
|
-
|
338
327
|
InCellEditingPlugin.prototype._rowClosing = false;
|
339
328
|
/** @type {boolean}
|
340
329
|
* @private
|
341
330
|
*/
|
342
|
-
|
343
331
|
InCellEditingPlugin.prototype._closingOnScroll = true;
|
344
332
|
/** @type {number}
|
345
333
|
* @private
|
346
334
|
*/
|
347
|
-
|
348
335
|
InCellEditingPlugin.prototype._editorTimerId = 0;
|
349
336
|
/** @type {boolean}
|
350
337
|
* @private
|
351
338
|
*/
|
352
|
-
|
353
339
|
InCellEditingPlugin._scrolling = false;
|
340
|
+
|
354
341
|
/** @type {number}
|
355
342
|
* @private
|
356
343
|
*/
|
357
|
-
|
358
344
|
InCellEditingPlugin.prototype._elfVersion = 0;
|
359
345
|
/** @type {string}
|
360
346
|
* @private
|
361
347
|
*/
|
362
|
-
|
363
348
|
InCellEditingPlugin._primaryColor = "";
|
349
|
+
|
364
350
|
/** @type {string}
|
365
351
|
* @private
|
366
352
|
*/
|
367
|
-
|
368
353
|
InCellEditingPlugin._styles = prettifyCss([":host .cell.editing input[type=text]", ["border-style: solid;"]]);
|
354
|
+
|
369
355
|
/** @private
|
370
356
|
*/
|
371
|
-
|
372
357
|
InCellEditingPlugin._onThemeLoaded = function () {
|
373
358
|
var colors = ElfUtil.getColors();
|
374
359
|
InCellEditingPlugin._primaryColor = colors.primary;
|
375
360
|
};
|
361
|
+
|
376
362
|
/** @private
|
377
363
|
* @param {string} tag element tag
|
364
|
+
* @param {Object=} attributes attribute of input element
|
378
365
|
* @return {Element} input element
|
379
366
|
*/
|
380
|
-
|
381
|
-
|
382
|
-
InCellEditingPlugin.prototype._createInputElement = function (tag) {
|
367
|
+
InCellEditingPlugin.prototype._createInputElement = function (tag, attributes) {
|
383
368
|
var t = this;
|
384
369
|
var elem = document.createElement(tag);
|
385
|
-
var
|
386
|
-
|
370
|
+
for (var attribute in attributes) {
|
371
|
+
elem.setAttribute(attribute, attributes[attribute]);
|
372
|
+
}
|
373
|
+
var typeMap = InCellEditingPlugin._uiElementTypesMap;
|
374
|
+
// Resolve elf theme style
|
387
375
|
elem.style.width = "100%";
|
388
376
|
elem.style.height = "100%";
|
389
377
|
elem.style.margin = "0";
|
390
378
|
elem.style.borderColor = InCellEditingPlugin._primaryColor || "#ee7600";
|
391
379
|
elem.style.maxHeight = "unset";
|
392
|
-
|
393
380
|
if (tag === typeMap.checkbox) {
|
394
381
|
elem.style.borderStyle = "solid";
|
395
382
|
elem.style.borderWidth = "1px";
|
@@ -408,13 +395,10 @@ InCellEditingPlugin.prototype._createInputElement = function (tag) {
|
|
408
395
|
} else if (tag === typeMap.input) {
|
409
396
|
elem.setAttribute("type", "text");
|
410
397
|
}
|
411
|
-
|
412
398
|
if (this._autoSuggest) {
|
413
399
|
this._autoSuggest.addEventListener("item-select", t._onAutoSuggestItemSelected);
|
414
|
-
|
415
400
|
this._autoSuggest.addEventListener("wheel", t._stopPropagation, false);
|
416
401
|
}
|
417
|
-
|
418
402
|
elem.addEventListener("keydown", t._onTextKeyDown, false);
|
419
403
|
elem.addEventListener("keyup", t._onTextKeyUp, false);
|
420
404
|
elem.addEventListener("mousedown", t._stopPropagation, false);
|
@@ -425,43 +409,38 @@ InCellEditingPlugin.prototype._createInputElement = function (tag) {
|
|
425
409
|
elem.addEventListener("paste", t._stopPropagation, false);
|
426
410
|
return elem;
|
427
411
|
};
|
412
|
+
|
428
413
|
/** @private
|
429
414
|
* @return {Element}
|
430
415
|
*/
|
431
|
-
|
432
|
-
|
433
416
|
InCellEditingPlugin.prototype._createEditor = function () {
|
434
417
|
var editor = document.createElement("div");
|
435
418
|
editor.className = "cell editing";
|
436
419
|
editor.style.position = "absolute";
|
437
420
|
return editor;
|
438
421
|
};
|
422
|
+
|
439
423
|
/** @private
|
440
424
|
* @param {Element} editor
|
441
425
|
* @return {Popup} popup instance
|
442
426
|
*/
|
443
|
-
|
444
|
-
|
445
427
|
InCellEditingPlugin.prototype._createBalloonPopup = function (editor) {
|
446
428
|
var popup = new Popup(editor, {
|
447
429
|
positioning: "over"
|
448
430
|
});
|
449
431
|
return popup;
|
450
432
|
};
|
433
|
+
|
451
434
|
/** @private
|
452
435
|
* @param {Object} grid core grid object
|
453
436
|
* @param {string} elemTag
|
437
|
+
* @param {Object=} attributes of element
|
454
438
|
* @return {object} inCellCache
|
455
439
|
*/
|
456
|
-
|
457
|
-
|
458
|
-
InCellEditingPlugin.prototype._createInCellCache = function (grid, elemTag) {
|
440
|
+
InCellEditingPlugin.prototype._createInCellCache = function (grid, elemTag, attributes) {
|
459
441
|
var t = this;
|
460
|
-
|
461
442
|
var editor = t._createEditor();
|
462
|
-
|
463
|
-
var inputElement = t._createInputElement(elemTag);
|
464
|
-
|
443
|
+
var inputElement = t._createInputElement(elemTag, attributes);
|
465
444
|
var balloonPopup = new Popup(editor, {
|
466
445
|
positioning: "over"
|
467
446
|
});
|
@@ -473,114 +452,96 @@ InCellEditingPlugin.prototype._createInCellCache = function (grid, elemTag) {
|
|
473
452
|
balloonPopup: balloonPopup
|
474
453
|
};
|
475
454
|
};
|
455
|
+
|
476
456
|
/** @private
|
477
457
|
* @param {Object} grid core grid object
|
478
458
|
* @return {object} inCellCache
|
479
459
|
*/
|
480
|
-
|
481
|
-
|
482
460
|
InCellEditingPlugin.prototype._createTitleEditor = function (grid) {
|
483
461
|
var t = this;
|
484
|
-
|
485
462
|
if (!t._headerInCellCache) {
|
486
463
|
t._headerInCellCache = t._createInCellCache(grid, "input");
|
487
464
|
}
|
488
|
-
|
489
465
|
return t._headerInCellCache;
|
490
466
|
};
|
467
|
+
|
491
468
|
/** @private
|
492
469
|
* @param {number} columnIndex
|
493
470
|
* @param {Object} grid core grid object
|
494
471
|
* @return {object} inCellCache
|
495
472
|
*/
|
496
|
-
|
497
|
-
|
498
473
|
InCellEditingPlugin.prototype._createContentEditor = function (columnIndex, grid) {
|
499
474
|
var t = this;
|
500
475
|
var typeMap = InCellEditingPlugin._uiElementTypesMap;
|
501
|
-
|
502
476
|
var columnData = t._getColumnData(columnIndex, grid);
|
503
|
-
|
504
477
|
var inCellColumnConfig = columnData["inCellEditing"];
|
505
478
|
var elemTag = typeMap[inCellColumnConfig && inCellColumnConfig.type] || t._defaultTag;
|
506
|
-
|
507
479
|
if (!columnData["inCellCache"]) {
|
508
|
-
|
480
|
+
var attributes = inCellColumnConfig ? inCellColumnConfig.attributes : null;
|
481
|
+
columnData["inCellCache"] = t._createInCellCache(grid, elemTag, attributes);
|
509
482
|
}
|
483
|
+
var inCellCache = columnData["inCellCache"];
|
510
484
|
|
511
|
-
|
512
|
-
|
485
|
+
// Setup initial value for the editor
|
513
486
|
if (elemTag === typeMap.select || elemTag === typeMap.combobox) {
|
514
487
|
inCellCache["inputElement"].data = inCellColumnConfig && inCellColumnConfig.entries;
|
515
488
|
}
|
516
|
-
|
517
489
|
return inCellCache;
|
518
490
|
};
|
519
491
|
/** @override
|
520
492
|
* @return {string}
|
521
493
|
*/
|
522
|
-
|
523
|
-
|
524
494
|
InCellEditingPlugin.prototype.getName = function () {
|
525
495
|
return "InCellEditingPlugin";
|
526
496
|
};
|
497
|
+
|
527
498
|
/** @private
|
528
499
|
* @param {Event|Element} e
|
529
500
|
*/
|
530
|
-
|
531
|
-
|
532
501
|
InCellEditingPlugin.prototype._onColumnAdded = function (e) {
|
533
502
|
if (e.context && e.colIndex != null) {
|
534
503
|
// e.context is a columnOption;
|
535
504
|
this._retrieveColumnOption(e.context, e.colIndex);
|
536
505
|
}
|
537
506
|
};
|
507
|
+
|
538
508
|
/** Called by grid system when initial plugins.
|
539
509
|
* @public
|
540
510
|
* @param {Object} host core grid object
|
541
511
|
* @param {Object} options
|
542
512
|
*/
|
543
|
-
|
544
|
-
|
545
513
|
InCellEditingPlugin.prototype.initialize = function (host, options) {
|
546
514
|
if (this._hosts.indexOf(host) >= 0) {
|
547
515
|
return;
|
548
516
|
}
|
549
|
-
|
550
517
|
if (!this._hosts.length) {
|
551
518
|
window.addEventListener("scroll", this._onScroll);
|
552
519
|
}
|
553
|
-
|
554
520
|
host.listen("columnAdded", this._onColumnAdded);
|
555
521
|
host.getVScrollbar().listen("scroll", this._onScroll);
|
556
522
|
host.getHScrollbar().listen("scroll", this._onScroll);
|
557
|
-
|
558
523
|
if (this._dblClick) {
|
559
|
-
host.listen("dblclick", this._onDoubleClick);
|
524
|
+
host.listen("dblclick", this._onDoubleClick);
|
560
525
|
|
526
|
+
// Make a comparable functionality for touchscreen
|
561
527
|
if (isTouchDevice()) {
|
562
528
|
host.listen("touchstart", this._onTouchStart);
|
563
529
|
host.listen("touchend", this._onTouchEnd);
|
564
530
|
host.listen("touchcancel", this._onTouchEnd);
|
565
531
|
}
|
566
532
|
}
|
567
|
-
|
568
533
|
this._hosts.push(host);
|
569
|
-
|
570
534
|
if (ElfUtil.getElfVersion() < 4) {
|
571
535
|
// ef-input available in elf version < 4
|
572
536
|
InCellEditingPlugin._uiElementTypesMap["number"] = "ef-input";
|
573
537
|
}
|
574
|
-
|
575
538
|
if (ElfUtil.isHaloTheme()) {
|
576
539
|
if (!host._inCellEditingStyles) {
|
577
540
|
host._inCellEditingStyles = true;
|
578
541
|
injectCss(InCellEditingPlugin._styles, host.getElement());
|
579
542
|
}
|
580
543
|
}
|
581
|
-
|
582
544
|
this.config(options);
|
583
|
-
|
584
545
|
if (!InCellEditingPlugin._primaryColor) {
|
585
546
|
ElfUtil.getThemeColors().then(InCellEditingPlugin._onThemeLoaded)["catch"](InCellEditingPlugin._onThemeLoaded);
|
586
547
|
}
|
@@ -591,8 +552,6 @@ InCellEditingPlugin.prototype.initialize = function (host, options) {
|
|
591
552
|
* @param {*} optionVal
|
592
553
|
* @return {*} The transformed value of the option
|
593
554
|
*/
|
594
|
-
|
595
|
-
|
596
555
|
InCellEditingPlugin.prototype.beforeProcessOption = function (optionName, optionVal) {
|
597
556
|
if (optionName == "cellEditing") {
|
598
557
|
return null; // eslint-disable-line
|
@@ -603,36 +562,31 @@ InCellEditingPlugin.prototype.beforeProcessOption = function (optionName, option
|
|
603
562
|
/** @private
|
604
563
|
* @override
|
605
564
|
*/
|
606
|
-
|
607
|
-
|
608
565
|
InCellEditingPlugin.prototype._afterInit = function () {
|
609
566
|
this._elfVersion = ElfUtil.getElfVersion();
|
610
567
|
};
|
568
|
+
|
611
569
|
/** @public
|
612
570
|
* @param {Object=} options
|
613
571
|
*/
|
614
|
-
|
615
|
-
|
616
572
|
InCellEditingPlugin.prototype.config = function (options) {
|
617
573
|
if (!options) {
|
618
574
|
return;
|
619
575
|
}
|
576
|
+
var t = this;
|
620
577
|
|
621
|
-
|
622
|
-
|
578
|
+
// config column
|
623
579
|
var columns = options["columns"];
|
624
|
-
|
625
580
|
if (columns) {
|
626
581
|
var len = columns.length;
|
627
|
-
|
628
582
|
for (var c = 0; c < len; ++c) {
|
629
583
|
t._retrieveColumnOption(columns[c], c);
|
630
584
|
}
|
631
585
|
}
|
632
|
-
|
633
586
|
var pluginOption = options["inCellEditing"];
|
634
|
-
if (!pluginOption) return;
|
587
|
+
if (!pluginOption) return;
|
635
588
|
|
589
|
+
// options
|
636
590
|
if (pluginOption["type"]) t._defaultTag = InCellEditingPlugin._uiElementTypesMap[pluginOption["type"]];
|
637
591
|
if (pluginOption["balloonMode"]) t.enableBalloonMode(pluginOption["balloonMode"]);
|
638
592
|
if (pluginOption["editableTitle"]) t.enableTitleEditing(pluginOption["editableTitle"]);
|
@@ -641,34 +595,27 @@ InCellEditingPlugin.prototype.config = function (options) {
|
|
641
595
|
if (pluginOption["autoCommitText"]) t.enableAutoCommitText(pluginOption["autoCommitText"]);
|
642
596
|
if (pluginOption["dataBinding"] != null) t.disableDataBinding(!pluginOption["dataBinding"]);
|
643
597
|
if (pluginOption["contentSource"] != null) t._contentSource = pluginOption["contentSource"];
|
644
|
-
|
645
598
|
if (pluginOption["popupElement"]) {
|
646
599
|
t.setPopupElement(pluginOption["popupElement"]);
|
647
600
|
}
|
648
|
-
|
649
601
|
if (pluginOption["doubleClick"] != null) t.disableDblClick(!pluginOption["doubleClick"]);
|
650
|
-
|
651
602
|
if (pluginOption["inlineStyling"]) {
|
652
603
|
t._inlineStyling = true;
|
653
604
|
}
|
654
|
-
|
655
605
|
if (pluginOption["disablingScroll"]) {
|
656
606
|
t._disablingScroll = true;
|
657
607
|
}
|
658
|
-
|
659
608
|
if (pluginOption["uiBlocking"]) {
|
660
609
|
t._uiBlocking = true;
|
661
610
|
}
|
662
|
-
|
663
611
|
if (pluginOption["autoSuggest"]) {
|
664
612
|
t._autoSuggest = pluginOption["autoSuggest"];
|
665
613
|
}
|
666
|
-
|
667
614
|
if (pluginOption["closingOnScroll"] == false) {
|
668
615
|
t._closingOnScroll = false;
|
669
|
-
}
|
670
|
-
|
616
|
+
}
|
671
617
|
|
618
|
+
// event callback
|
672
619
|
t.addListener(pluginOption, "preEditorOpening");
|
673
620
|
t.addListener(pluginOption, "editorOpened");
|
674
621
|
t.addListener(pluginOption, "beforeCommit");
|
@@ -677,51 +624,52 @@ InCellEditingPlugin.prototype.config = function (options) {
|
|
677
624
|
t.addListener(pluginOption, "beforeRowCommit");
|
678
625
|
t.addListener(pluginOption, "rowEditorClosed");
|
679
626
|
};
|
627
|
+
|
680
628
|
/** Get a current state of grid and extension config
|
681
629
|
* @public
|
682
630
|
* @param {Object=} out_obj
|
683
631
|
* @returns {!Object}
|
684
632
|
*/
|
685
|
-
|
686
|
-
|
687
633
|
InCellEditingPlugin.prototype.getConfigObject = function (out_obj) {
|
688
634
|
var obj = out_obj || {};
|
689
635
|
var columns = obj.columns;
|
690
|
-
|
691
636
|
if (!columns) {
|
692
637
|
columns = obj.columns = [];
|
693
638
|
}
|
694
|
-
|
695
639
|
var len = this.getColumnCount();
|
696
|
-
|
640
|
+
var val, opt;
|
697
641
|
for (var i = 0; i < len; ++i) {
|
698
642
|
var col = columns[i];
|
699
|
-
|
700
643
|
if (!col) {
|
701
644
|
col = columns[i] = {};
|
702
645
|
}
|
703
|
-
|
704
|
-
var opt = this._getColumnData(i);
|
705
|
-
|
646
|
+
opt = this._getColumnData(i);
|
706
647
|
if (!opt) {
|
707
648
|
continue;
|
708
649
|
}
|
709
|
-
|
710
650
|
if (opt.editableContent != null) {
|
711
651
|
col.editableContent = opt.editableContent;
|
712
652
|
}
|
713
|
-
|
714
653
|
if (opt.inCellEditing != null) {
|
715
|
-
col.inCellEditing =
|
654
|
+
col.inCellEditing = {};
|
655
|
+
val = opt.inCellEditing["type"];
|
656
|
+
if (val != null) {
|
657
|
+
col.inCellEditing["type"] = val;
|
658
|
+
}
|
659
|
+
val = opt.inCellEditing["entries"];
|
660
|
+
if (val != null) {
|
661
|
+
col.inCellEditing["entries"] = val;
|
662
|
+
}
|
663
|
+
val = opt.inCellEditing["attributes"];
|
664
|
+
if (val != null) {
|
665
|
+
col.inCellEditing["attributes"] = val;
|
666
|
+
}
|
716
667
|
}
|
717
668
|
}
|
718
|
-
|
719
669
|
var extOptions = obj.inCellEditing;
|
720
|
-
|
721
670
|
if (!extOptions) {
|
722
671
|
extOptions = obj.inCellEditing = {};
|
723
672
|
}
|
724
|
-
|
725
673
|
extOptions.balloonMode = this._balloonMode;
|
726
674
|
extOptions.editableTitle = this._editableTitle;
|
727
675
|
extOptions.editableContent = this._editableContent;
|
@@ -735,19 +683,16 @@ InCellEditingPlugin.prototype.getConfigObject = function (out_obj) {
|
|
735
683
|
extOptions.uiBlocking = this._uiBlocking;
|
736
684
|
return obj;
|
737
685
|
};
|
686
|
+
|
738
687
|
/** @private
|
739
688
|
* @param {Object} columnOption
|
740
689
|
* @param {number} colIndex
|
741
690
|
*/
|
742
|
-
|
743
|
-
|
744
691
|
InCellEditingPlugin.prototype._retrieveColumnOption = function (columnOption, colIndex) {
|
745
692
|
var pluginOptions = columnOption["inCellEditing"];
|
746
693
|
var editableContent = columnOption["editableContent"];
|
747
|
-
|
748
694
|
if (pluginOptions != null || editableContent != null) {
|
749
695
|
var colData = this._newColumnData(colIndex);
|
750
|
-
|
751
696
|
if (pluginOptions != null) {
|
752
697
|
colData["inCellEditing"] = pluginOptions;
|
753
698
|
pluginOptions.entries = CoralItems.create(pluginOptions.entries); // Create entries for coral select and combobox
|
@@ -758,18 +703,14 @@ InCellEditingPlugin.prototype._retrieveColumnOption = function (columnOption, co
|
|
758
703
|
}
|
759
704
|
}
|
760
705
|
};
|
761
|
-
/** @override */
|
762
|
-
|
763
706
|
|
707
|
+
/** @override */
|
764
708
|
InCellEditingPlugin.prototype.unload = function (host) {
|
765
709
|
var at = this._hosts.indexOf(host);
|
766
|
-
|
767
710
|
if (at < 0) {
|
768
711
|
return;
|
769
712
|
}
|
770
|
-
|
771
713
|
this._hosts.splice(at, 1);
|
772
|
-
|
773
714
|
host.unlisten("columnAdded", this._onColumnAdded);
|
774
715
|
host.getVScrollbar().unlisten("scroll", this._onScroll);
|
775
716
|
host.getHScrollbar().unlisten("scroll", this._onScroll);
|
@@ -777,15 +718,14 @@ InCellEditingPlugin.prototype.unload = function (host) {
|
|
777
718
|
host.unlisten("touchstart", this._onTouchStart);
|
778
719
|
host.unlisten("touchend", this._onTouchEnd);
|
779
720
|
host.unlisten("touchcancel", this._onTouchEnd);
|
780
|
-
|
781
721
|
if (!this._hosts.length) {
|
782
722
|
this._touchTimerId = 0;
|
783
723
|
this._editorTimerId = 0;
|
784
724
|
window.removeEventListener("scroll", this._onScroll);
|
785
725
|
}
|
786
|
-
|
787
726
|
this._dispose();
|
788
727
|
};
|
728
|
+
|
789
729
|
/** @public
|
790
730
|
* @param {number} colIndex
|
791
731
|
* @param {number} rowIndex
|
@@ -793,23 +733,17 @@ InCellEditingPlugin.prototype.unload = function (host) {
|
|
793
733
|
* @param {Object=} grid core grid object
|
794
734
|
* @fires InCellEditingPlugin#editorOpened
|
795
735
|
*/
|
796
|
-
|
797
|
-
|
798
736
|
InCellEditingPlugin.prototype.openEditor = function (colIndex, rowIndex, sectionRef, grid) {
|
799
737
|
if (!grid) {
|
800
738
|
grid = this._hosts[0];
|
801
|
-
|
802
739
|
if (!grid) {
|
803
740
|
return;
|
804
741
|
}
|
805
742
|
}
|
806
|
-
|
807
743
|
var sectionSettings = grid.getSectionSettings(sectionRef || "content");
|
808
744
|
var activePos = this._activePos;
|
809
|
-
|
810
745
|
if (activePos) {
|
811
746
|
var sectionName = sectionSettings ? sectionSettings.getType() : "";
|
812
|
-
|
813
747
|
if (activePos["colIndex"] === colIndex && activePos["rowIndex"] === rowIndex && activePos["sectionName"] === sectionName && activePos["grid"] === grid) {
|
814
748
|
return; // The same cell is open twice
|
815
749
|
}
|
@@ -819,7 +753,6 @@ InCellEditingPlugin.prototype.openEditor = function (colIndex, rowIndex, section
|
|
819
753
|
|
820
754
|
var section = sectionSettings ? sectionSettings.getSection() : null;
|
821
755
|
var cell = section ? section.getCell(colIndex, rowIndex) : null;
|
822
|
-
|
823
756
|
if (!cell) {
|
824
757
|
return; // Some input is invalid
|
825
758
|
}
|
@@ -829,85 +762,76 @@ InCellEditingPlugin.prototype.openEditor = function (colIndex, rowIndex, section
|
|
829
762
|
|
830
763
|
setTimeout(this._openEditor.bind(this, cell, grid), 100);
|
831
764
|
};
|
765
|
+
|
832
766
|
/** @public
|
833
767
|
* @param {boolean=} opt_forceCommit
|
834
768
|
* @fires InCellEditingPlugin#cancelled
|
835
769
|
*/
|
836
|
-
|
837
|
-
|
838
770
|
InCellEditingPlugin.prototype.closeCellEditor = function (opt_forceCommit) {
|
839
771
|
this._commitText(opt_forceCommit || this._autoCommitText);
|
840
772
|
};
|
773
|
+
|
841
774
|
/** @public
|
842
775
|
* @param {boolean=} opt_enabled
|
843
776
|
*/
|
844
|
-
|
845
|
-
|
846
777
|
InCellEditingPlugin.prototype.enableBalloonMode = function (opt_enabled) {
|
847
778
|
this._balloonMode = opt_enabled !== false;
|
848
779
|
};
|
780
|
+
|
849
781
|
/** @public
|
850
782
|
* @param {boolean=} opt_enabled
|
851
783
|
*/
|
852
|
-
|
853
|
-
|
854
784
|
InCellEditingPlugin.prototype.enableTitleEditing = function (opt_enabled) {
|
855
785
|
this._editableTitle = opt_enabled !== false;
|
856
786
|
};
|
787
|
+
|
857
788
|
/** Disable editing on all title sections
|
858
789
|
* @public
|
859
790
|
* @param {boolean=} opt_disabled
|
860
791
|
*/
|
861
|
-
|
862
|
-
|
863
792
|
InCellEditingPlugin.prototype.disableTitleEditing = function (opt_disabled) {
|
864
793
|
this._editableTitle = opt_disabled === false;
|
865
794
|
};
|
795
|
+
|
866
796
|
/** Disable editing on a per cell basis
|
867
797
|
* @public
|
868
798
|
* @param {Object} cell Grid cell object
|
869
799
|
* @param {boolean=} opt_disabled
|
870
800
|
*/
|
871
|
-
|
872
|
-
|
873
801
|
InCellEditingPlugin.prototype.disableCellEditing = function (cell, opt_disabled) {
|
874
802
|
if (cell) {
|
875
803
|
cell.enableClass("no-editing", opt_disabled !== false);
|
876
804
|
}
|
877
805
|
};
|
806
|
+
|
878
807
|
/** @public
|
879
808
|
* @param {boolean=} opt_disabled
|
880
809
|
*/
|
881
|
-
|
882
|
-
|
883
810
|
InCellEditingPlugin.prototype.disableDataBinding = function (opt_disabled) {
|
884
811
|
this._dataBinding = opt_disabled === false;
|
885
812
|
};
|
813
|
+
|
886
814
|
/** @public
|
887
815
|
* @param {boolean=} opt_disabled
|
888
816
|
*/
|
889
|
-
|
890
|
-
|
891
817
|
InCellEditingPlugin.prototype.disableDblClick = function (opt_disabled) {
|
892
818
|
var dblClick = opt_disabled === false;
|
893
|
-
|
894
819
|
if (this._dblClick !== dblClick) {
|
895
820
|
this._dblClick = dblClick;
|
896
|
-
|
897
821
|
for (var i = this._hosts.length; --i >= 0;) {
|
898
822
|
this._listenForTriggering(this._hosts[i], dblClick);
|
899
823
|
}
|
900
824
|
}
|
901
825
|
};
|
826
|
+
|
902
827
|
/** Checking Editing is in process.
|
903
828
|
* @public
|
904
829
|
* @return {boolean}
|
905
830
|
*/
|
906
|
-
|
907
|
-
|
908
831
|
InCellEditingPlugin.prototype.isEditing = function () {
|
909
832
|
return this._editing;
|
910
833
|
};
|
834
|
+
|
911
835
|
/**
|
912
836
|
* @public
|
913
837
|
* @param {number=} columnIndex column index of editor, used in row editing mode
|
@@ -917,19 +841,14 @@ InCellEditingPlugin.prototype.isEditing = function () {
|
|
917
841
|
* for row editing mode, specific column index and grid instance is need.
|
918
842
|
* for cell editing mode. function not require param since only one editor can be opened at a time.
|
919
843
|
*/
|
920
|
-
|
921
|
-
|
922
844
|
InCellEditingPlugin.prototype.getTextBox = function (columnIndex, grid) {
|
923
845
|
if (this._activeRowId) {
|
924
846
|
// for row editing mode
|
925
847
|
// get rowEditor that's stored in column data
|
926
848
|
grid = grid || this._hosts[0];
|
927
|
-
|
928
849
|
if (grid) {
|
929
850
|
var columnData = this._getColumnData(columnIndex, grid);
|
930
|
-
|
931
851
|
var inCellCache = columnData["inCellCache"];
|
932
|
-
|
933
852
|
if (inCellCache) {
|
934
853
|
return inCellCache["inputElement"];
|
935
854
|
}
|
@@ -938,17 +857,16 @@ InCellEditingPlugin.prototype.getTextBox = function (columnIndex, grid) {
|
|
938
857
|
// for cell editing mode
|
939
858
|
return this._activeInCellCache["inputElement"];
|
940
859
|
}
|
941
|
-
|
942
860
|
return null; // no editor open
|
943
861
|
};
|
862
|
+
|
944
863
|
/** @public
|
945
864
|
* @return {string}
|
946
865
|
*/
|
947
|
-
|
948
|
-
|
949
866
|
InCellEditingPlugin.prototype.getInitialText = function () {
|
950
867
|
return this._initialText;
|
951
868
|
};
|
869
|
+
|
952
870
|
/** @private
|
953
871
|
* @param {Object} dataSource DataView
|
954
872
|
* @param {number} rowIndex
|
@@ -956,95 +874,78 @@ InCellEditingPlugin.prototype.getInitialText = function () {
|
|
956
874
|
* @param {Element=} content element that get from cell.getContent
|
957
875
|
* @return {*}
|
958
876
|
*/
|
959
|
-
|
960
|
-
|
961
877
|
InCellEditingPlugin.prototype._getSourceContent = function (dataSource, rowIndex, field, content) {
|
962
878
|
if (this._contentSource == "field") {
|
963
879
|
return this._getData(dataSource, rowIndex, field);
|
964
880
|
} else {
|
965
881
|
var textNode, str;
|
966
|
-
|
967
882
|
if (content) {
|
968
883
|
var len = content.childNodes.length;
|
969
|
-
|
970
884
|
for (var i = 0; i < len; ++i) {
|
971
885
|
if (content.childNodes[i].nodeType === 3) {
|
972
886
|
textNode = content.childNodes[i]; // To preserve current content structure
|
973
|
-
|
974
887
|
break;
|
975
888
|
}
|
976
889
|
}
|
977
890
|
}
|
978
|
-
|
979
891
|
if (textNode) {
|
980
892
|
str = textNode.textContent;
|
981
893
|
} else if (content) {
|
982
894
|
str = content.textContent;
|
983
895
|
}
|
984
|
-
|
985
896
|
return str;
|
986
897
|
}
|
987
898
|
};
|
899
|
+
|
988
900
|
/**
|
989
901
|
* @public
|
990
902
|
* @param {string} rowId
|
991
903
|
* @return {!number} row index will return -1 if not found
|
992
904
|
*/
|
993
|
-
|
994
|
-
|
995
905
|
InCellEditingPlugin.prototype._getRowIndex = function (rowId) {
|
996
906
|
if (rowId && this._lastActiveGrid) {
|
997
907
|
var dv = this._lastActiveGrid.getDataSource();
|
998
|
-
|
999
908
|
if (dv) return dv.getRowIndex(rowId);
|
1000
909
|
}
|
1001
|
-
|
1002
910
|
return -1;
|
1003
911
|
};
|
912
|
+
|
1004
913
|
/**
|
1005
914
|
* @public
|
1006
915
|
* @param {number} rowIndex
|
1007
916
|
* @return {!string} return empty string if not found
|
1008
917
|
*/
|
1009
|
-
|
1010
|
-
|
1011
918
|
InCellEditingPlugin.prototype._getRowId = function (rowIndex) {
|
1012
919
|
if (rowIndex != null && this._lastActiveGrid) {
|
1013
920
|
var dv = this._lastActiveGrid.getDataSource();
|
1014
|
-
|
1015
921
|
if (dv) return dv.getRowId(rowIndex);
|
1016
922
|
}
|
1017
|
-
|
1018
923
|
return "";
|
1019
924
|
};
|
925
|
+
|
1020
926
|
/** @public
|
1021
927
|
* @return {Object|null} core grid object
|
1022
928
|
*/
|
1023
|
-
|
1024
|
-
|
1025
929
|
InCellEditingPlugin.prototype.getActiveGrid = function () {
|
1026
930
|
return this._activePos ? this._activePos["grid"] : null;
|
1027
931
|
};
|
932
|
+
|
1028
933
|
/** get active column index that editor had opended. Function can work only in cell editing mode.
|
1029
934
|
* @public
|
1030
935
|
* @return {number} column index will return -1 if not found
|
1031
936
|
*/
|
1032
|
-
|
1033
|
-
|
1034
937
|
InCellEditingPlugin.prototype.getActiveColIndex = function () {
|
1035
938
|
if (this._activePos) {
|
1036
939
|
var colIndex = this._activePos["colIndex"];
|
1037
940
|
if (colIndex != null) return colIndex;
|
1038
941
|
}
|
1039
|
-
|
1040
942
|
return -1;
|
1041
943
|
};
|
944
|
+
|
1042
945
|
/** get active row index that editor had opended. Function Can work in both cell/row editing modes.
|
1043
946
|
* @public
|
1044
947
|
* @return {number} row index will return -1 if not found
|
1045
948
|
*/
|
1046
|
-
|
1047
|
-
|
1048
949
|
InCellEditingPlugin.prototype.getActiveRowIndex = function () {
|
1049
950
|
if (this._activeRowId) {
|
1050
951
|
// row editing mode
|
@@ -1054,35 +955,30 @@ InCellEditingPlugin.prototype.getActiveRowIndex = function () {
|
|
1054
955
|
var rowIndex = this._activePos["rowIndex"];
|
1055
956
|
if (rowIndex != null) return rowIndex;
|
1056
957
|
}
|
1057
|
-
|
1058
958
|
return -1;
|
1059
959
|
};
|
960
|
+
|
1060
961
|
/** @public
|
1061
962
|
* @return {Object}
|
1062
963
|
*/
|
1063
|
-
|
1064
|
-
|
1065
964
|
InCellEditingPlugin.prototype.getInputElementPosition = function () {
|
1066
965
|
return this._activePos || null;
|
1067
966
|
};
|
967
|
+
|
1068
968
|
/** @public
|
1069
969
|
* @param {boolean=} opt_enable
|
1070
970
|
*/
|
1071
|
-
|
1072
|
-
|
1073
971
|
InCellEditingPlugin.prototype.enableAutoCommitText = function (opt_enable) {
|
1074
972
|
this._autoCommitText = opt_enable !== false;
|
1075
973
|
};
|
974
|
+
|
1076
975
|
/** Check if the column can be edited by double click
|
1077
976
|
* @public
|
1078
977
|
* @param {number} colIndex
|
1079
978
|
* @return {boolean}
|
1080
979
|
*/
|
1081
|
-
|
1082
|
-
|
1083
980
|
InCellEditingPlugin.prototype.isColumnEditable = function (colIndex) {
|
1084
981
|
var val = this._getColumnOption(colIndex, "editableContent");
|
1085
|
-
|
1086
982
|
return val == null ? this._editableContent : val;
|
1087
983
|
};
|
1088
984
|
/** @private
|
@@ -1090,83 +986,68 @@ InCellEditingPlugin.prototype.isColumnEditable = function (colIndex) {
|
|
1090
986
|
* @param {Object=} opt_host core grid object
|
1091
987
|
* @fires InCellEditingPlugin#editorOpened
|
1092
988
|
*/
|
1093
|
-
|
1094
|
-
|
1095
989
|
InCellEditingPlugin.prototype._onDoubleClick = function (e, opt_host) {
|
1096
990
|
var t = this;
|
1097
991
|
var host = opt_host || t.getRelativeGrid(e);
|
1098
|
-
|
1099
992
|
if (t.isEditing() || !host) {
|
1100
993
|
return;
|
1101
994
|
}
|
1102
|
-
|
1103
995
|
var arg = host.getRelativePosition(e);
|
1104
996
|
var sectionType = arg["sectionType"];
|
1105
|
-
|
1106
997
|
if (sectionType === "content" && !t.isColumnEditable(arg["colIndex"])) {
|
1107
998
|
return;
|
1108
999
|
} else if (sectionType === "title" && !t._editableTitle) {
|
1109
1000
|
return;
|
1110
1001
|
} else if (sectionType === "header") {
|
1111
1002
|
return;
|
1112
|
-
}
|
1113
|
-
|
1003
|
+
}
|
1114
1004
|
|
1005
|
+
// Initialize internal states
|
1115
1006
|
if (e["preventDefault"]) {
|
1116
1007
|
Dom.preventDefault(e);
|
1117
1008
|
}
|
1118
|
-
|
1119
1009
|
t.openEditor(arg.colIndex, arg.rowIndex, arg.section, host);
|
1120
1010
|
};
|
1011
|
+
|
1121
1012
|
/** @private
|
1122
1013
|
* @param {Element} e
|
1123
1014
|
* @param {Object} host core grid object
|
1124
1015
|
* @param {Object=} arg
|
1125
1016
|
*/
|
1126
|
-
|
1127
|
-
|
1128
1017
|
InCellEditingPlugin.prototype._openEditor = function (e, host, arg) {
|
1129
1018
|
var t = this;
|
1130
|
-
|
1131
1019
|
if (!host.getElement() || this._hosts.indexOf(host) < 0) {
|
1132
1020
|
// Check validity due to asyncronous call
|
1133
1021
|
return;
|
1134
1022
|
}
|
1135
|
-
|
1136
1023
|
if (!arg) {
|
1137
1024
|
arg = host.getRelativePosition(e);
|
1138
1025
|
}
|
1139
|
-
|
1140
1026
|
if (!arg["hit"]) {
|
1141
1027
|
// The specified cell could be gone during the asyncronous process
|
1142
1028
|
return;
|
1143
1029
|
}
|
1144
|
-
|
1145
1030
|
t._dispatch("preEditorOpening", arg);
|
1146
|
-
|
1147
1031
|
if (arg["cancel"]) {
|
1148
1032
|
return;
|
1149
1033
|
}
|
1150
|
-
|
1151
1034
|
var colIndex = arg["colIndex"];
|
1152
1035
|
var rowIndex = arg["rowIndex"];
|
1153
1036
|
var section = arg["section"];
|
1154
1037
|
var cell = section.getCell(colIndex, rowIndex);
|
1155
1038
|
var rowSpan = 1;
|
1156
1039
|
var stretchedCell = section.getStretchedCell(cell, rowIndex);
|
1157
|
-
|
1158
1040
|
if (stretchedCell) {
|
1159
1041
|
cell = stretchedCell;
|
1160
1042
|
} else {
|
1161
1043
|
rowSpan = section.getCellRowSpan(colIndex, rowIndex);
|
1162
1044
|
}
|
1163
|
-
|
1164
1045
|
if (!cell || cell.hasClass("no-editing")) {
|
1165
1046
|
return;
|
1166
|
-
}
|
1167
|
-
//
|
1168
|
-
|
1047
|
+
}
|
1048
|
+
// Everything has been verified at this point. We can start the opening process.
|
1169
1049
|
|
1050
|
+
// close row editor first
|
1170
1051
|
t.closeRowEditor(false, host);
|
1171
1052
|
section.addClass("edit-mode");
|
1172
1053
|
t._lastActiveGrid = host;
|
@@ -1175,116 +1056,92 @@ InCellEditingPlugin.prototype._openEditor = function (e, host, arg) {
|
|
1175
1056
|
arg["content"] = t._prevContent = cell.getContent();
|
1176
1057
|
arg["field"] = t._getField(colIndex);
|
1177
1058
|
var dataSource = arg["dataSource"];
|
1178
|
-
|
1179
1059
|
if (dataSource != null) {
|
1180
1060
|
var rowId = arg["rowId"] = this._getRowId(arg["rowIndex"]);
|
1181
|
-
|
1182
1061
|
arg["groupHeader"] = dataSource.isSegmentSeparator(rowId) || dataSource.getGroupByRowId(rowId);
|
1183
1062
|
arg["rowData"] = this._getRow(dataSource, rowId);
|
1184
|
-
}
|
1185
|
-
|
1063
|
+
}
|
1186
1064
|
|
1065
|
+
// Initialize UIs
|
1187
1066
|
if (arg["sectionType"] === "title") {
|
1188
1067
|
t._activeInCellCache = t._createTitleEditor(host);
|
1189
1068
|
} else {
|
1190
1069
|
t._activeInCellCache = t._createContentEditor(colIndex, host);
|
1191
1070
|
}
|
1192
|
-
|
1193
1071
|
var inputElement = arg["inputElement"] = t._activeInCellCache["inputElement"];
|
1194
1072
|
var editor = arg["editor"] = t._activeInCellCache["editor"];
|
1195
1073
|
var balloonPopup = t._activeInCellCache["balloonPopup"];
|
1196
1074
|
var sourceContent = arg ? t._getSourceContent(arg["dataSource"], arg["rowIndex"], arg["field"], arg["content"]) : "";
|
1197
|
-
|
1198
1075
|
if (rowIndex + 1 >= section.getRowCount()) {
|
1199
1076
|
inputElement.classList.add("bottom");
|
1200
1077
|
} else {
|
1201
1078
|
inputElement.classList.remove("bottom");
|
1202
|
-
}
|
1203
|
-
|
1079
|
+
}
|
1204
1080
|
|
1081
|
+
// Initialize Balloon
|
1205
1082
|
t._usingBalloon = t._isBalloonMode(cell);
|
1206
|
-
|
1207
1083
|
if (t._usingBalloon) {
|
1208
1084
|
editor.classList.add("balloon");
|
1209
1085
|
} else {
|
1210
1086
|
editor.classList.remove("balloon");
|
1211
1087
|
}
|
1212
|
-
|
1213
1088
|
var editorStyle = editor.style;
|
1214
|
-
|
1215
1089
|
if (this._elfVersion || t._inlineStyling) {
|
1216
1090
|
editorStyle.backgroundColor = section.getComputedStyle().backgroundColor;
|
1217
1091
|
}
|
1218
|
-
|
1219
1092
|
var rowH = section.getRowHeight(rowIndex);
|
1220
1093
|
var width = cell.getWidth();
|
1221
|
-
|
1222
1094
|
if (!host.isPinnedColumn(colIndex)) {
|
1223
1095
|
var hScrollbar = host.getHScrollbar();
|
1224
|
-
|
1225
1096
|
if (hScrollbar.isActive()) {
|
1226
1097
|
var paneSize = hScrollbar.getPaneSize();
|
1227
|
-
|
1228
1098
|
if (width > paneSize) {
|
1229
1099
|
width = paneSize;
|
1230
1100
|
}
|
1231
1101
|
}
|
1232
1102
|
}
|
1233
|
-
|
1234
1103
|
if (!t._usingBalloon || width > 208) {
|
1235
1104
|
editorStyle.width = width + "px";
|
1236
1105
|
} else {
|
1237
1106
|
editorStyle.width = "";
|
1238
1107
|
}
|
1239
|
-
|
1240
1108
|
if (rowSpan > 1) {
|
1241
1109
|
editorStyle.height = cell.getHeight() + "px";
|
1242
1110
|
} else {
|
1243
1111
|
editorStyle.height = rowH + "px";
|
1244
|
-
}
|
1245
|
-
|
1112
|
+
}
|
1246
1113
|
|
1114
|
+
// Attach our popup (balloon element)
|
1247
1115
|
var parentElement = document.body;
|
1248
|
-
|
1249
1116
|
if (t._compositeGrid || t._realTimeGrid) {
|
1250
1117
|
var activeGrid = t.getActiveGrid();
|
1251
|
-
|
1252
1118
|
if (activeGrid) {
|
1253
1119
|
parentElement = activeGrid.getElement().parentElement;
|
1254
1120
|
}
|
1255
1121
|
}
|
1256
|
-
|
1257
1122
|
balloonPopup.enableUIBlocking(t._uiBlocking);
|
1258
1123
|
balloonPopup.addEventListener("hidden", t._onPopupHide);
|
1259
1124
|
balloonPopup.disableAutoHiding(false);
|
1260
1125
|
balloonPopup.disableHideOnScroll(true);
|
1261
1126
|
balloonPopup.attachTo(cell.getElement());
|
1262
1127
|
balloonPopup.show(true, parentElement);
|
1128
|
+
this._updateEditorPopup(t._activeInCellCache, cell, host);
|
1263
1129
|
|
1264
|
-
|
1265
|
-
|
1266
|
-
|
1130
|
+
// Attach user element
|
1267
1131
|
if (t._customElement) {
|
1268
1132
|
t._customElementPopup.attachTo(editor);
|
1269
|
-
|
1270
1133
|
t._customElementPopup.show(true, parentElement);
|
1271
|
-
|
1272
1134
|
t._customElementPopup.disableAutoHiding(false);
|
1273
|
-
|
1274
1135
|
arg["popupElement"] = t._customElement;
|
1275
|
-
}
|
1276
|
-
|
1136
|
+
}
|
1277
1137
|
|
1138
|
+
// WARNING: value-changed event from ELF v3 component may NOT be triggered due to their design flaw
|
1278
1139
|
t._setText(sourceContent, inputElement);
|
1279
|
-
|
1280
1140
|
arg["initialText"] = t._initialText = sourceContent;
|
1281
|
-
|
1282
1141
|
if (t._disablingScroll) {
|
1283
1142
|
t._freezeScrolling(host, true);
|
1284
1143
|
}
|
1285
|
-
|
1286
1144
|
arg["autoSuggest"] = t._autoSuggest;
|
1287
|
-
|
1288
1145
|
if (t._autoSuggest) {
|
1289
1146
|
if (t._autoSuggest.attach === inputElement) {
|
1290
1147
|
t._autoSuggest.attach = null; // WORKAROUND: reset attach for re-attach target
|
@@ -1294,87 +1151,73 @@ InCellEditingPlugin.prototype._openEditor = function (e, host, arg) {
|
|
1294
1151
|
// if we appendChild all time when open editor, events won't work
|
1295
1152
|
editor.appendChild(t._autoSuggest);
|
1296
1153
|
}
|
1297
|
-
|
1298
1154
|
t._autoSuggest.attach = inputElement;
|
1299
1155
|
t._autoSuggest.positionTarget = inputElement; // for re-position of autosuggest
|
1300
|
-
}
|
1301
|
-
|
1156
|
+
}
|
1302
1157
|
|
1158
|
+
// Dispatch an event for user to setup stuff
|
1303
1159
|
t._dispatch("editorOpened", arg); // User may modify the editor
|
1304
1160
|
|
1305
|
-
|
1306
1161
|
inputElement.focus();
|
1307
|
-
|
1308
1162
|
if (typeof inputElement.select === "function") {
|
1309
1163
|
inputElement.select();
|
1310
1164
|
}
|
1311
|
-
|
1312
1165
|
arg["initialText"] = t._initialText = t.getText(); // After all modifications, cache the string for text change event
|
1313
|
-
|
1314
1166
|
t._editing = true; // Editing state cannot be false until a text has been committed or cancelled
|
1315
1167
|
};
|
1168
|
+
|
1316
1169
|
/** Using to open row editor.
|
1317
1170
|
* @public
|
1318
1171
|
* @param {number} rowIndex
|
1319
1172
|
* @param {Object=} grid core grid object
|
1320
1173
|
*/
|
1321
|
-
|
1322
|
-
|
1323
1174
|
InCellEditingPlugin.prototype.openRowEditor = function (rowIndex, grid) {
|
1324
1175
|
var t = this;
|
1325
|
-
grid = grid || t._hosts[0];
|
1326
|
-
|
1176
|
+
grid = grid || t._hosts[0];
|
1177
|
+
// if open same row we will do nothing
|
1327
1178
|
if (t._getRowIndex(t._activeRowId) === rowIndex || !grid) {
|
1328
1179
|
return;
|
1329
|
-
}
|
1330
|
-
|
1180
|
+
}
|
1331
1181
|
|
1182
|
+
// close all open editor
|
1332
1183
|
t.closeRowEditor(false, grid);
|
1333
|
-
|
1334
1184
|
t._commitText(false);
|
1335
|
-
|
1336
1185
|
var firstInput, firstPopup;
|
1337
1186
|
var section = grid.getSection("content");
|
1338
1187
|
var dataSource = grid.getDataSource();
|
1339
1188
|
var lastIndex = (section.getColumnCount() || 0) - 1;
|
1340
1189
|
var isBottom = rowIndex + 1 >= section.getRowCount();
|
1341
1190
|
var sectionBGColor = this._elfVersion || t._inlineStyling ? section.getComputedStyle().backgroundColor : null;
|
1342
|
-
var rowH = section.getRowHeight(rowIndex);
|
1191
|
+
var rowH = section.getRowHeight(rowIndex);
|
1343
1192
|
|
1344
|
-
|
1345
|
-
|
1193
|
+
// if normally parent popup will be document.body
|
1194
|
+
var parentElement = document.body;
|
1346
1195
|
|
1196
|
+
// but if grid is _compositeGrid or _realTimeGrid then
|
1197
|
+
// then we will use grid parent instead
|
1347
1198
|
if (t._compositeGrid || t._realTimeGrid) {
|
1348
1199
|
parentElement = grid.getElement().parentElement;
|
1349
|
-
}
|
1350
|
-
|
1200
|
+
}
|
1351
1201
|
|
1202
|
+
// loop for all column
|
1352
1203
|
for (var columnIndex = 0; columnIndex <= lastIndex; columnIndex++) {
|
1353
1204
|
// ignore column that can't edit
|
1354
1205
|
if (!t.isColumnEditable(columnIndex)) {
|
1355
1206
|
continue;
|
1356
1207
|
}
|
1357
|
-
|
1358
1208
|
var cell = section.getCell(columnIndex, rowIndex);
|
1359
|
-
|
1360
1209
|
if (!cell || cell.hasClass("no-editing")) {
|
1361
1210
|
continue;
|
1362
1211
|
} // all verify is done
|
1363
|
-
// create editor, popup, inputElement
|
1364
|
-
|
1365
1212
|
|
1213
|
+
// create editor, popup, inputElement
|
1366
1214
|
var inCellCache = t._createContentEditor(columnIndex, grid);
|
1367
|
-
|
1368
1215
|
var content = cell.getContent();
|
1369
|
-
|
1370
1216
|
var field = t._getField(columnIndex);
|
1371
|
-
|
1372
1217
|
var sourceContent = t._getSourceContent(dataSource, rowIndex, field, content);
|
1373
|
-
|
1374
1218
|
var inputElement = inCellCache["inputElement"];
|
1375
1219
|
var editor = inCellCache["editor"];
|
1376
1220
|
var balloonPopup = inCellCache["balloonPopup"];
|
1377
|
-
|
1378
1221
|
if (!firstInput) {
|
1379
1222
|
firstInput = inputElement;
|
1380
1223
|
firstPopup = balloonPopup;
|
@@ -1382,25 +1225,21 @@ InCellEditingPlugin.prototype.openRowEditor = function (rowIndex, grid) {
|
|
1382
1225
|
} else {
|
1383
1226
|
balloonPopup.enableUIBlocking(false);
|
1384
1227
|
}
|
1385
|
-
|
1386
1228
|
t._setText(sourceContent, inputElement); // WARNING: value-changed event from ELF v3 component may be triggered due to their design flaw
|
1387
1229
|
|
1388
|
-
|
1389
1230
|
if (isBottom) {
|
1390
1231
|
inputElement.classList.add("bottom");
|
1391
1232
|
} else {
|
1392
1233
|
inputElement.classList.remove("bottom");
|
1393
1234
|
}
|
1394
|
-
|
1395
1235
|
var editorStyle = editor.style;
|
1396
|
-
|
1397
1236
|
if (sectionBGColor) {
|
1398
1237
|
editorStyle.backgroundColor = sectionBGColor;
|
1399
1238
|
}
|
1239
|
+
editorStyle.height = rowH + "px";
|
1400
1240
|
|
1401
|
-
|
1241
|
+
// this is different from single edit mode
|
1402
1242
|
// row edit mode not support balloon mode
|
1403
|
-
|
1404
1243
|
var width = section.getCellWidth(columnIndex, rowIndex);
|
1405
1244
|
editorStyle.width = width + "px";
|
1406
1245
|
editor.classList.remove("balloon");
|
@@ -1408,46 +1247,40 @@ InCellEditingPlugin.prototype.openRowEditor = function (rowIndex, grid) {
|
|
1408
1247
|
balloonPopup.disableHideOnScroll(true);
|
1409
1248
|
balloonPopup.attachTo(cell.getElement());
|
1410
1249
|
balloonPopup.show(true, parentElement);
|
1250
|
+
this._updateEditorPopup(inCellCache, cell, grid);
|
1411
1251
|
|
1412
|
-
|
1413
|
-
|
1414
|
-
} // if firstInput not undefined that mean at lease one popup is open
|
1415
|
-
|
1252
|
+
// this._updateEditorLayout(inputElement); // Adjust sizes after append to the DOM
|
1253
|
+
}
|
1416
1254
|
|
1255
|
+
// if firstInput not undefined that mean at lease one popup is open
|
1417
1256
|
if (firstInput) {
|
1418
1257
|
firstPopup.addEventListener("hidden", t._onPopupHide);
|
1419
1258
|
t._lastActiveGrid = grid;
|
1420
1259
|
t._editing = true; // Editing state cannot be false until a text has been committed or cancelled
|
1421
|
-
|
1422
1260
|
t._activeRowId = this._getRowId(rowIndex);
|
1423
1261
|
firstInput.focus();
|
1424
1262
|
section.addClass("edit-mode");
|
1425
|
-
|
1426
1263
|
if (t._disablingScroll) {
|
1427
1264
|
t._freezeScrolling(grid, true);
|
1428
1265
|
}
|
1429
1266
|
}
|
1430
1267
|
};
|
1268
|
+
|
1431
1269
|
/** Using to close row editor.
|
1432
1270
|
* @public
|
1433
1271
|
* @param {boolean=} isCommit=true Default is true, to save change that user made to datasource
|
1434
1272
|
* @fires InCellEditingPlugin#beforeRowCommit
|
1435
1273
|
* @fires InCellEditingPlugin#rowEditorClosed
|
1436
1274
|
*/
|
1437
|
-
|
1438
|
-
|
1439
1275
|
InCellEditingPlugin.prototype.closeRowEditor = function (isCommit) {
|
1440
1276
|
var t = this;
|
1441
|
-
var grid = t._lastActiveGrid;
|
1442
|
-
|
1277
|
+
var grid = t._lastActiveGrid;
|
1278
|
+
// if no row active then do nothing
|
1443
1279
|
if (!t._activeRowId || !grid) {
|
1444
1280
|
return;
|
1445
1281
|
}
|
1446
|
-
|
1447
1282
|
var rowId = t._activeRowId;
|
1448
|
-
|
1449
1283
|
var rowIndex = t._getRowIndex(rowId);
|
1450
|
-
|
1451
1284
|
if (rowIndex <= -1) {
|
1452
1285
|
isCommit = false; // rowIndex -1 mean row is not found or already disposed
|
1453
1286
|
} else {
|
@@ -1458,31 +1291,29 @@ InCellEditingPlugin.prototype.closeRowEditor = function (isCommit) {
|
|
1458
1291
|
var columnLength = grid.getColumnCount();
|
1459
1292
|
var fieldValue = {};
|
1460
1293
|
var inCellCaches = [];
|
1461
|
-
var inCellCache;
|
1294
|
+
var inCellCache;
|
1462
1295
|
|
1296
|
+
// in this section we just prepare data
|
1463
1297
|
for (var columnIndex = 0; columnIndex < columnLength; columnIndex++) {
|
1464
1298
|
var columnData = t._getColumnData(columnIndex, grid);
|
1299
|
+
inCellCache = columnData && columnData["inCellCache"];
|
1465
1300
|
|
1466
|
-
|
1467
|
-
|
1301
|
+
// if not have inCellCache then this column not have editor
|
1468
1302
|
if (!inCellCache) {
|
1469
1303
|
continue;
|
1470
1304
|
}
|
1471
|
-
|
1472
1305
|
inCellCache.columnIndex = columnIndex;
|
1473
1306
|
inCellCaches.push(inCellCache);
|
1474
|
-
|
1475
1307
|
if (isCommit) {
|
1476
1308
|
var field = t._getField(columnIndex);
|
1477
|
-
|
1478
1309
|
inCellCache.field = field;
|
1479
1310
|
fieldValue[field] = this._getValue(inCellCache["inputElement"]);
|
1480
1311
|
}
|
1481
1312
|
}
|
1482
|
-
|
1483
1313
|
var length = inCellCaches.length;
|
1484
|
-
var i, e;
|
1314
|
+
var i, e;
|
1485
1315
|
|
1316
|
+
// dispatch event beforeRowCommit
|
1486
1317
|
if (isCommit) {
|
1487
1318
|
if (t.hasListener("beforeRowCommit")) {
|
1488
1319
|
e = {
|
@@ -1492,37 +1323,31 @@ InCellEditingPlugin.prototype.closeRowEditor = function (isCommit) {
|
|
1492
1323
|
cancel: false,
|
1493
1324
|
rowId: t._activeRowId
|
1494
1325
|
};
|
1495
|
-
|
1496
|
-
|
1497
|
-
|
1498
|
-
|
1326
|
+
t._dispatch("beforeRowCommit", e);
|
1327
|
+
// e.cancel = true mean user want to cancel closeRowEditor operation
|
1499
1328
|
isCommit = !e.cancel;
|
1500
1329
|
}
|
1501
|
-
|
1502
1330
|
if (isCommit) {
|
1503
1331
|
var dataSource = grid.getDataSource();
|
1504
|
-
|
1505
1332
|
for (i = 0; i < length; i++) {
|
1506
1333
|
inCellCache = inCellCaches[i];
|
1507
|
-
var value = fieldValue[inCellCache.field];
|
1508
|
-
|
1334
|
+
var value = fieldValue[inCellCache.field];
|
1335
|
+
// set data to datasource
|
1509
1336
|
if (dataSource) {
|
1510
1337
|
// only use value from fieldValue
|
1511
1338
|
// because fieldValue maybe mutate from beforeRowCommit event
|
1512
1339
|
t._setData(dataSource, rowIndex, inCellCache.field, value);
|
1513
|
-
}
|
1514
|
-
|
1340
|
+
}
|
1515
1341
|
|
1342
|
+
// set value to ui if content is a build in text
|
1516
1343
|
var cell = section.getCell(inCellCache.columnIndex, rowIndex);
|
1517
1344
|
var content = cell.getContent();
|
1518
|
-
|
1519
1345
|
if (content && content.classList.contains("text")) {
|
1520
1346
|
cell.setContent(value);
|
1521
1347
|
}
|
1522
1348
|
}
|
1523
1349
|
}
|
1524
1350
|
}
|
1525
|
-
|
1526
1351
|
if (t.hasListener("rowEditorClosed")) {
|
1527
1352
|
e = {
|
1528
1353
|
grid: grid,
|
@@ -1530,27 +1355,25 @@ InCellEditingPlugin.prototype.closeRowEditor = function (isCommit) {
|
|
1530
1355
|
fieldValue: fieldValue,
|
1531
1356
|
committed: isCommit
|
1532
1357
|
};
|
1533
|
-
|
1534
1358
|
t._dispatch("rowEditorClosed", e);
|
1535
|
-
}
|
1536
|
-
|
1359
|
+
}
|
1537
1360
|
|
1361
|
+
// hide editor by remove popup from dom
|
1538
1362
|
for (i = 0; i < length; i++) {
|
1539
1363
|
var popup = inCellCaches[i].balloonPopup;
|
1540
1364
|
popup.removeEventListener("hidden", t._onPopupHide); // remove event every popup to make sure nothing left
|
1541
|
-
|
1542
1365
|
popup.hide();
|
1543
1366
|
}
|
1367
|
+
t._freezeScrolling(grid, false);
|
1544
1368
|
|
1545
|
-
|
1546
|
-
|
1547
|
-
|
1369
|
+
// reset status and resource
|
1548
1370
|
section.removeClass("edit-mode");
|
1549
1371
|
t._editing = false;
|
1550
1372
|
t._activeRowId = "";
|
1551
1373
|
t._lastActiveGrid = null;
|
1552
1374
|
grid.focus();
|
1553
1375
|
};
|
1376
|
+
|
1554
1377
|
/** open row editor if no any row editor opened, and close row editor if it already opened
|
1555
1378
|
* @public
|
1556
1379
|
* @param {number} rowIndex
|
@@ -1559,8 +1382,6 @@ InCellEditingPlugin.prototype.closeRowEditor = function (isCommit) {
|
|
1559
1382
|
* @fires InCellEditingPlugin#beforeRowCommit
|
1560
1383
|
* @fires InCellEditingPlugin#rowEditorClosed
|
1561
1384
|
*/
|
1562
|
-
|
1563
|
-
|
1564
1385
|
InCellEditingPlugin.prototype.toggleRowEditor = function (rowIndex, isCommit, grid) {
|
1565
1386
|
if (this._getRowIndex(this._activeRowId) === rowIndex) {
|
1566
1387
|
this.closeRowEditor(isCommit, grid);
|
@@ -1571,165 +1392,135 @@ InCellEditingPlugin.prototype.toggleRowEditor = function (rowIndex, isCommit, gr
|
|
1571
1392
|
this.openRowEditor(rowIndex, grid);
|
1572
1393
|
}
|
1573
1394
|
};
|
1395
|
+
|
1574
1396
|
/** handle grid scrolling not window scroll
|
1575
1397
|
* @private
|
1576
1398
|
* @param {Object} e
|
1577
1399
|
*/
|
1578
|
-
|
1579
|
-
|
1580
1400
|
InCellEditingPlugin.prototype._onScroll = function (e) {
|
1581
1401
|
this._scrolling = true;
|
1582
|
-
|
1583
1402
|
if (!this._closingOnScroll && this._editing) {
|
1584
1403
|
if (this._activeInCellCache) {
|
1585
1404
|
var popup = this._activeInCellCache.balloonPopup;
|
1586
1405
|
popup.hide();
|
1587
1406
|
} else if (this._activeRowId) {
|
1588
1407
|
var grid = this.getActiveGrid() || this._lastActiveGrid;
|
1589
|
-
|
1590
1408
|
var section = grid.getSection("content");
|
1591
1409
|
var lastIndex = (section.getColumnCount() || 0) - 1;
|
1592
|
-
|
1593
1410
|
for (var columnIndex = 0; columnIndex <= lastIndex; columnIndex++) {
|
1594
1411
|
var columnData = this._getColumnData(columnIndex, grid);
|
1595
|
-
|
1596
1412
|
var inCellCache = columnData["inCellCache"];
|
1597
|
-
|
1598
1413
|
if (!inCellCache) {
|
1599
1414
|
continue;
|
1600
1415
|
}
|
1601
|
-
|
1602
1416
|
var popupCache = inCellCache["balloonPopup"];
|
1603
|
-
|
1604
1417
|
if (popupCache) {
|
1605
1418
|
popupCache.hide();
|
1606
1419
|
}
|
1607
1420
|
}
|
1608
1421
|
}
|
1609
1422
|
}
|
1610
|
-
|
1611
1423
|
this._onPopupHide();
|
1612
|
-
|
1613
1424
|
this._scrolling = false;
|
1614
1425
|
};
|
1426
|
+
|
1615
1427
|
/** handle popup hidden event
|
1616
1428
|
* @private
|
1617
1429
|
* @param {Object} e
|
1618
1430
|
*/
|
1619
|
-
|
1620
|
-
|
1621
1431
|
InCellEditingPlugin.prototype._onPopupHide = function (e) {
|
1622
1432
|
if (!this._closingOnScroll) {
|
1623
1433
|
if (this._scrolling) {
|
1624
1434
|
this.requestShowEditorPopup();
|
1625
1435
|
return;
|
1626
1436
|
}
|
1627
|
-
}
|
1437
|
+
}
|
1438
|
+
// in cell editing mode, when popup hide for any reason
|
1628
1439
|
// cell editing will be close and make a commit. (depend on _autoCommitText flag)
|
1629
1440
|
// WARNING: when user scroll outside grid. it will call _onPopupHide as well
|
1441
|
+
this._commitText(this._autoCommitText);
|
1630
1442
|
|
1631
|
-
|
1632
|
-
this._commitText(this._autoCommitText); // for row editing mode if editor hide by any reason
|
1443
|
+
// for row editing mode if editor hide by any reason
|
1633
1444
|
// we will call close closeRowEditor to reset all internal flag status
|
1634
1445
|
// row editing mode not care about _autoCommitText. (for the time being)
|
1635
|
-
|
1636
|
-
|
1637
1446
|
this.closeRowEditor(false);
|
1638
1447
|
};
|
1448
|
+
|
1639
1449
|
/** @private
|
1640
1450
|
* @param {Object} event
|
1641
1451
|
*/
|
1642
|
-
|
1643
|
-
|
1644
1452
|
InCellEditingPlugin.prototype._onAutoSuggestItemSelected = function (event) {
|
1645
1453
|
if (event.detail.target) {
|
1646
1454
|
var method = event.detail.method;
|
1647
1455
|
var value = event.detail.target.value;
|
1648
|
-
|
1649
1456
|
if (method === 'enter' || method === 'click') {
|
1650
1457
|
if (value) {
|
1651
1458
|
this.setText(value);
|
1652
|
-
|
1653
1459
|
this._commitText(true);
|
1654
1460
|
}
|
1655
1461
|
}
|
1656
1462
|
}
|
1657
1463
|
};
|
1464
|
+
|
1658
1465
|
/** @private
|
1659
1466
|
* @param {Object} e
|
1660
1467
|
*/
|
1661
|
-
|
1662
|
-
|
1663
1468
|
InCellEditingPlugin.prototype._onValueChanged = function (e) {
|
1664
1469
|
if (this._activeRowId) {
|
1665
1470
|
return;
|
1666
1471
|
} // do nothing in rowEditMode
|
1667
1472
|
|
1668
|
-
|
1669
1473
|
this._commitText(true);
|
1670
1474
|
};
|
1475
|
+
|
1671
1476
|
/** @private
|
1672
1477
|
* @param {Object} e
|
1673
1478
|
*/
|
1674
|
-
|
1675
|
-
|
1676
1479
|
InCellEditingPlugin.prototype._onTextKeyDown = function (e) {
|
1677
1480
|
e.stopPropagation();
|
1678
|
-
|
1679
1481
|
if (this._activeRowId) {
|
1680
1482
|
return;
|
1681
1483
|
} // do nothing in rowEditMode
|
1682
|
-
// KeyCodes.ESC = 27
|
1683
|
-
|
1684
1484
|
|
1485
|
+
// KeyCodes.ESC = 27
|
1685
1486
|
if (e.keyCode === 27) {
|
1686
1487
|
this._commitText(this._autoCommitText);
|
1687
|
-
}
|
1688
|
-
|
1689
|
-
|
1488
|
+
}
|
1489
|
+
// KeyCodes.TAB = 9
|
1690
1490
|
if (e.keyCode === 9) {
|
1691
1491
|
// For check press tab key when user tab on auto suggest list
|
1692
1492
|
// When user tab on auto suggest, the focus should be in input and data doesn't commit
|
1693
1493
|
if (this._autoSuggest && this._autoSuggest.suggestions.length > 0) {
|
1694
1494
|
this._activeInCellCache.inputElement.focus();
|
1695
1495
|
}
|
1696
|
-
|
1697
1496
|
e.preventDefault(); // stop losing focus
|
1698
1497
|
}
|
1699
1498
|
};
|
1499
|
+
|
1700
1500
|
/** @private
|
1701
1501
|
* @param {Object} e
|
1702
1502
|
*/
|
1703
|
-
|
1704
|
-
|
1705
1503
|
InCellEditingPlugin.prototype._onTextKeyUp = function (e) {
|
1706
1504
|
e.stopPropagation();
|
1707
|
-
|
1708
1505
|
if (this._activeRowId) {
|
1709
1506
|
return;
|
1710
1507
|
} // do nothing in rowEditMode
|
1711
1508
|
|
1712
|
-
|
1713
1509
|
if (this.hasListener("keyUp")) {
|
1714
1510
|
this._activePos["text"] = this._activePos["enteredText"] = this._activeInCellCache["inputElement"].value;
|
1715
|
-
|
1716
1511
|
this._dispatch("keyUp", this._activePos);
|
1717
|
-
}
|
1718
|
-
|
1512
|
+
}
|
1719
1513
|
|
1514
|
+
// KeyCodes.ENTER = 13 && KeyCodes.TAB = 9
|
1720
1515
|
var tabKey = e.keyCode === 9;
|
1721
|
-
|
1722
1516
|
if (tabKey || e.keyCode === 13) {
|
1723
1517
|
var text = this.getText();
|
1724
1518
|
var cellInfo = this._activePos;
|
1725
|
-
|
1726
1519
|
if (this._initialText !== text) {
|
1727
1520
|
e.preventDefault(); // TODO: Check if this is needed
|
1728
1521
|
// Clear auto suggest and doesn't commit when user tab on auto suggest item
|
1729
|
-
|
1730
1522
|
if (this._autoSuggest && this._autoSuggest.suggestions.length > 0) {
|
1731
1523
|
this._activeInCellCache.inputElement.focus();
|
1732
|
-
|
1733
1524
|
this._autoSuggest.suggestions = [];
|
1734
1525
|
return; // when use tabToMove with auto suggest, it shouldn't be effect when doesn't commit text
|
1735
1526
|
} else {
|
@@ -1738,16 +1529,12 @@ InCellEditingPlugin.prototype._onTextKeyUp = function (e) {
|
|
1738
1529
|
} else {
|
1739
1530
|
this._commitText(false);
|
1740
1531
|
}
|
1741
|
-
|
1742
1532
|
if (tabKey && this._tabToMove && !e.altKey && !e.ctrlKey) {
|
1743
1533
|
var host = cellInfo ? cellInfo["grid"] : null;
|
1744
|
-
|
1745
1534
|
if (host && host["getCellInfo"]) {
|
1746
1535
|
var dv = host.getDataSource();
|
1747
|
-
|
1748
1536
|
while (cellInfo) {
|
1749
1537
|
cellInfo = e.shiftKey ? host.getPrevCell(cellInfo) : host.getNextCell(cellInfo);
|
1750
|
-
|
1751
1538
|
if (cellInfo && cellInfo["cell"]) {
|
1752
1539
|
if (dv.getRowDataAt(cellInfo["rowIndex"])) {
|
1753
1540
|
// Check group header row
|
@@ -1768,48 +1555,39 @@ InCellEditingPlugin.prototype._onTextKeyUp = function (e) {
|
|
1768
1555
|
* @private
|
1769
1556
|
* @param {boolean} committed
|
1770
1557
|
*/
|
1771
|
-
|
1772
|
-
|
1773
1558
|
InCellEditingPlugin.prototype._commitText = function (committed) {
|
1774
1559
|
var t = this;
|
1775
1560
|
var arg = t._activePos;
|
1776
|
-
|
1777
1561
|
if (!t.isEditing() || !arg) {
|
1778
1562
|
return;
|
1779
1563
|
}
|
1780
|
-
|
1781
1564
|
arg["section"].removeClass("edit-mode");
|
1782
1565
|
t._editing = false;
|
1783
1566
|
var enteredValue = arg["text"] = this.getValue();
|
1784
1567
|
var groupHeader = arg["groupHeader"] || false;
|
1785
|
-
|
1786
1568
|
if (committed) {
|
1787
1569
|
if (t.hasListener("beforeCommit")) {
|
1788
1570
|
t._dispatch("beforeCommit", arg);
|
1789
|
-
|
1790
1571
|
committed = !arg["cancel"];
|
1791
1572
|
enteredValue = arg["text"];
|
1792
1573
|
}
|
1793
|
-
|
1794
1574
|
if (committed && t._dataBinding && !groupHeader) {
|
1795
1575
|
var sectionSettings = arg["sectionSettings"];
|
1796
|
-
var sectionType = sectionSettings.getType();
|
1797
|
-
|
1576
|
+
var sectionType = sectionSettings.getType();
|
1577
|
+
// case edit content
|
1798
1578
|
if ("content" === sectionType) {
|
1799
1579
|
var dv = sectionSettings.getDataSource();
|
1800
|
-
|
1801
1580
|
if (dv) {
|
1802
1581
|
t._setData(dv, arg["rowIndex"], arg["field"], enteredValue);
|
1803
|
-
|
1804
1582
|
if (t._prevContent && t._prevContent.classList.contains("text")) {
|
1805
1583
|
// Bind data only if previous content is a build in text
|
1806
1584
|
t._activeCell.setContent(enteredValue);
|
1807
1585
|
}
|
1808
1586
|
}
|
1809
|
-
}
|
1587
|
+
}
|
1588
|
+
// case edit title
|
1810
1589
|
else if ("title" === sectionType) {
|
1811
1590
|
var _grid = this._compositeGrid || this._realTimeGrid || null;
|
1812
|
-
|
1813
1591
|
if (_grid) {
|
1814
1592
|
_grid.setColumnName(arg["colIndex"], enteredValue);
|
1815
1593
|
}
|
@@ -1818,57 +1596,48 @@ InCellEditingPlugin.prototype._commitText = function (committed) {
|
|
1818
1596
|
}
|
1819
1597
|
}
|
1820
1598
|
}
|
1821
|
-
|
1822
1599
|
if (t.hasListener("editorClosed")) {
|
1823
1600
|
arg["canceled"] = arg["cancelled"] = !committed;
|
1824
1601
|
arg["committed"] = committed;
|
1825
|
-
|
1826
1602
|
t._dispatch("editorClosed", arg);
|
1827
1603
|
}
|
1828
|
-
|
1829
1604
|
if (t._activeInCellCache && t._activeInCellCache.balloonPopup) {
|
1830
1605
|
t._activeInCellCache.balloonPopup.removeEventListener("hidden", t._onPopupHide);
|
1831
|
-
|
1832
1606
|
t._activeInCellCache.balloonPopup.hide();
|
1833
1607
|
}
|
1834
|
-
|
1835
1608
|
Dom.removeParent(t._customElement);
|
1836
|
-
|
1837
1609
|
t._freezeScrolling(arg["grid"], false);
|
1838
|
-
|
1839
1610
|
arg["grid"].focus();
|
1840
1611
|
t._activePos = t._activeCell = t._prevContent = t._lastActiveGrid = t._activeInCellCache = null;
|
1841
1612
|
};
|
1613
|
+
|
1842
1614
|
/** @private
|
1843
1615
|
* @param {Event} e
|
1844
1616
|
*/
|
1845
|
-
|
1846
|
-
|
1847
1617
|
InCellEditingPlugin.prototype._stopPropagation = function (e) {
|
1848
1618
|
e.stopPropagation();
|
1849
1619
|
};
|
1620
|
+
|
1850
1621
|
/** Using for Check balloon mode is turn on/off.
|
1851
1622
|
* @private
|
1852
1623
|
* @param {Object} cell Grid cell object
|
1853
1624
|
* @return {boolean}
|
1854
1625
|
*/
|
1855
|
-
|
1856
|
-
|
1857
1626
|
InCellEditingPlugin.prototype._isBalloonMode = function (cell) {
|
1858
1627
|
var cellElem = cell.getElement();
|
1859
1628
|
var compStyles = cellElem ? window.getComputedStyle(cellElem) : {};
|
1860
1629
|
return this._balloonMode || compStyles.display === "none" || compStyles.visibility === "hidden";
|
1861
1630
|
};
|
1631
|
+
|
1862
1632
|
/** @private
|
1863
1633
|
* @param {Object} host core grid object
|
1864
1634
|
* @param {boolean} bool
|
1865
1635
|
*/
|
1866
|
-
|
1867
|
-
|
1868
1636
|
InCellEditingPlugin.prototype._listenForTriggering = function (host, bool) {
|
1869
1637
|
if (bool) {
|
1870
|
-
host.listen("dblclick", this._onDoubleClick);
|
1638
|
+
host.listen("dblclick", this._onDoubleClick);
|
1871
1639
|
|
1640
|
+
// Make a comparable functionality for touchscreen
|
1872
1641
|
if (isTouchDevice()) {
|
1873
1642
|
host.listen("touchstart", this._onTouchStart);
|
1874
1643
|
host.listen("touchend", this._onTouchEnd);
|
@@ -1881,102 +1650,85 @@ InCellEditingPlugin.prototype._listenForTriggering = function (host, bool) {
|
|
1881
1650
|
host.unlisten("touchcancel", this._onTouchEnd);
|
1882
1651
|
}
|
1883
1652
|
};
|
1653
|
+
|
1884
1654
|
/** Use only On-Touch-Start event on mobile devices.
|
1885
1655
|
* @private
|
1886
1656
|
* @param {Object} e
|
1887
1657
|
*/
|
1888
|
-
|
1889
|
-
|
1890
1658
|
InCellEditingPlugin.prototype._onTouchStart = function (e) {
|
1891
1659
|
this._resetTouchTimer();
|
1892
|
-
|
1893
1660
|
this._touchTimerId = setTimeout(this._onTouchTimer, this._longPressTime);
|
1894
1661
|
};
|
1662
|
+
|
1895
1663
|
/** Use only press time on mobile devices.
|
1896
1664
|
* @private
|
1897
1665
|
* @param {Object} e
|
1898
1666
|
*/
|
1899
|
-
|
1900
|
-
|
1901
1667
|
InCellEditingPlugin.prototype._onTouchTimer = function (e) {
|
1902
1668
|
this._touchTimerId = 0;
|
1903
1669
|
};
|
1670
|
+
|
1904
1671
|
/** Use only On-Touch-End event on mobile devices.
|
1905
1672
|
* @private
|
1906
1673
|
* @param {Event} e
|
1907
1674
|
*/
|
1908
|
-
|
1909
|
-
|
1910
1675
|
InCellEditingPlugin.prototype._onTouchEnd = function (e) {
|
1911
1676
|
if (!this._resetTouchTimer()) {
|
1912
1677
|
this._onDoubleClick(e); // Trigger cell editor
|
1913
|
-
|
1914
1678
|
}
|
1915
1679
|
};
|
1680
|
+
|
1916
1681
|
/** Use only to reset timer on mobile devices.
|
1917
1682
|
* @private
|
1918
1683
|
* @return {boolean}
|
1919
1684
|
*/
|
1920
|
-
|
1921
|
-
|
1922
1685
|
InCellEditingPlugin.prototype._resetTouchTimer = function () {
|
1923
1686
|
if (this._touchTimerId) {
|
1924
1687
|
clearTimeout(this._touchTimerId);
|
1925
1688
|
this._touchTimerId = 0;
|
1926
1689
|
return true;
|
1927
1690
|
}
|
1928
|
-
|
1929
1691
|
return false;
|
1930
1692
|
};
|
1693
|
+
|
1931
1694
|
/** Set other elements to using like popup when editing cell.
|
1932
1695
|
* @public
|
1933
1696
|
* @param {Element} elm
|
1934
1697
|
*/
|
1935
|
-
|
1936
|
-
|
1937
1698
|
InCellEditingPlugin.prototype.setPopupElement = function (elm) {
|
1938
1699
|
var balloonPopup = this._activeInCellCache && this._activeInCellCache["balloonPopup"];
|
1939
|
-
|
1940
1700
|
if (this._customElement) {
|
1941
1701
|
balloonPopup && balloonPopup.removeFocusElement(this._customElement);
|
1942
|
-
|
1943
1702
|
this._customElementPopup.dispose();
|
1944
|
-
|
1945
1703
|
this._customElementPopup = null;
|
1946
1704
|
}
|
1947
|
-
|
1948
1705
|
this._customElement = elm;
|
1949
|
-
|
1950
1706
|
if (this._customElement) {
|
1951
1707
|
this._customElementPopup = new Popup(this._customElement);
|
1952
1708
|
balloonPopup && balloonPopup.addFocusElement(this._customElement);
|
1953
1709
|
}
|
1954
1710
|
};
|
1711
|
+
|
1955
1712
|
/** Set content to the editor but do not commit anything to internal storage.
|
1956
1713
|
* @public
|
1957
1714
|
* @param {*} content
|
1958
1715
|
*/
|
1959
|
-
|
1960
|
-
|
1961
1716
|
InCellEditingPlugin.prototype.setText = function (content) {
|
1962
1717
|
// TODO: since we have inputElement per each column
|
1963
1718
|
// we should receive column index to set value in specific column
|
1964
1719
|
this._activeInCellCache && this._setText(content, this._activeInCellCache["inputElement"]);
|
1965
1720
|
};
|
1721
|
+
|
1966
1722
|
/** @private
|
1967
1723
|
* @param {*} content
|
1968
1724
|
* @param {Element} inputElement editor element
|
1969
1725
|
*/
|
1970
|
-
|
1971
|
-
|
1972
1726
|
InCellEditingPlugin.prototype._setText = function (content, inputElement) {
|
1973
1727
|
inputElement._origValue = content;
|
1974
1728
|
var inputTag = inputElement.tagName.toLowerCase();
|
1975
1729
|
var typeMap = InCellEditingPlugin._uiElementTypesMap;
|
1976
|
-
|
1977
1730
|
if (inputTag === typeMap.checkbox) {
|
1978
1731
|
var checked = content ? !(content === "f" || content === "false") : false;
|
1979
|
-
|
1980
1732
|
if (checked) {
|
1981
1733
|
inputElement.setAttribute("checked", "true");
|
1982
1734
|
} else {
|
@@ -1996,7 +1748,6 @@ InCellEditingPlugin.prototype._setText = function (content, inputElement) {
|
|
1996
1748
|
ElfDate.setDate(inputElement, content);
|
1997
1749
|
} else {
|
1998
1750
|
var txt = "";
|
1999
|
-
|
2000
1751
|
if (content != null) {
|
2001
1752
|
if (typeof content === "string") {
|
2002
1753
|
txt = content;
|
@@ -2005,32 +1756,28 @@ InCellEditingPlugin.prototype._setText = function (content, inputElement) {
|
|
2005
1756
|
txt = content + "";
|
2006
1757
|
}
|
2007
1758
|
}
|
2008
|
-
|
2009
1759
|
inputElement.value = txt;
|
2010
1760
|
}
|
2011
1761
|
};
|
1762
|
+
|
2012
1763
|
/** Get current text from the editor
|
2013
1764
|
* @public
|
2014
1765
|
* @return {string}
|
2015
1766
|
* @see {@link InCellEditingPlugin#getValue}
|
2016
1767
|
*/
|
2017
|
-
|
2018
|
-
|
2019
1768
|
InCellEditingPlugin.prototype.getText = function () {
|
2020
1769
|
// TODO: since we have inputElement per each column
|
2021
1770
|
// we should receive column index to return text of inputElement in specific column
|
2022
1771
|
if (this._activeInCellCache) return this._getText(this._activeInCellCache["inputElement"]);else return "";
|
2023
1772
|
};
|
1773
|
+
|
2024
1774
|
/** @private
|
2025
1775
|
* @param {Element} inputElement editor element
|
2026
1776
|
* @return {string}
|
2027
1777
|
*/
|
2028
|
-
|
2029
|
-
|
2030
1778
|
InCellEditingPlugin.prototype._getText = function (inputElement) {
|
2031
1779
|
var inputTag = inputElement.tagName.toLowerCase();
|
2032
1780
|
var typeMap = InCellEditingPlugin._uiElementTypesMap;
|
2033
|
-
|
2034
1781
|
if (inputTag === typeMap.checkbox) {
|
2035
1782
|
return inputElement.checked + "";
|
2036
1783
|
} else if (inputTag === typeMap.combobox) {
|
@@ -2040,31 +1787,27 @@ InCellEditingPlugin.prototype._getText = function (inputElement) {
|
|
2040
1787
|
} else if (inputTag === typeMap.date) {
|
2041
1788
|
return inputElement.value + "";
|
2042
1789
|
}
|
2043
|
-
|
2044
1790
|
return inputElement.value;
|
2045
1791
|
};
|
1792
|
+
|
2046
1793
|
/** Convert current text from the editor to value corresponding to the type of the editor
|
2047
1794
|
* @public
|
2048
1795
|
* @return {*} Returned type is based on the type of the editor
|
2049
1796
|
* @see {@link InCellEditingPlugin#getText}
|
2050
1797
|
*/
|
2051
|
-
|
2052
|
-
|
2053
1798
|
InCellEditingPlugin.prototype.getValue = function () {
|
2054
1799
|
// TODO: since we have inputElement per each column
|
2055
1800
|
// we should receive column index to return value of inputElement in specific column
|
2056
1801
|
return this._activeInCellCache ? this._getValue(this._activeInCellCache["inputElement"]) : null;
|
2057
1802
|
};
|
1803
|
+
|
2058
1804
|
/** @private
|
2059
1805
|
* @param {Element} inputElement editor element
|
2060
1806
|
* @return {*} Returned type is based on the type of the editor
|
2061
1807
|
*/
|
2062
|
-
|
2063
|
-
|
2064
1808
|
InCellEditingPlugin.prototype._getValue = function (inputElement) {
|
2065
1809
|
var inputTag = inputElement.tagName.toLowerCase();
|
2066
1810
|
var typeMap = InCellEditingPlugin._uiElementTypesMap;
|
2067
|
-
|
2068
1811
|
if (inputTag === typeMap.checkbox) {
|
2069
1812
|
return inputElement.checked ? true : false;
|
2070
1813
|
} else if (inputTag === typeMap.date) {
|
@@ -2073,23 +1816,20 @@ InCellEditingPlugin.prototype._getValue = function (inputElement) {
|
|
2073
1816
|
) {
|
2074
1817
|
return +inputElement.value;
|
2075
1818
|
}
|
2076
|
-
|
2077
1819
|
return this._getText(inputElement);
|
2078
1820
|
};
|
1821
|
+
|
2079
1822
|
/** Use to clear text in text editor.
|
2080
1823
|
* @public
|
2081
1824
|
*/
|
2082
|
-
|
2083
|
-
|
2084
1825
|
InCellEditingPlugin.prototype.clearText = function () {
|
2085
1826
|
this.setText("");
|
2086
1827
|
};
|
1828
|
+
|
2087
1829
|
/** Use to append text in text editor. WARNING: Only works with the text type editor
|
2088
1830
|
* @public
|
2089
1831
|
* @param {string} word
|
2090
1832
|
*/
|
2091
|
-
|
2092
|
-
|
2093
1833
|
InCellEditingPlugin.prototype.appendText = function (word) {
|
2094
1834
|
// TODO: since we have inputElement per each column
|
2095
1835
|
// we should receive column index to return append text in specific column
|
@@ -2097,58 +1837,52 @@ InCellEditingPlugin.prototype.appendText = function (word) {
|
|
2097
1837
|
this._activeInCellCache["inputElement"].value += word;
|
2098
1838
|
}
|
2099
1839
|
};
|
1840
|
+
|
2100
1841
|
/** Commit text will set text and commit to cell.
|
2101
1842
|
* @public
|
2102
1843
|
* @param {string=} word
|
2103
1844
|
*/
|
2104
|
-
|
2105
|
-
|
2106
1845
|
InCellEditingPlugin.prototype.commitText = function (word) {
|
2107
1846
|
if (word) {
|
2108
1847
|
this.setText(word);
|
2109
1848
|
}
|
2110
|
-
|
2111
1849
|
this._commitText(true);
|
2112
1850
|
};
|
1851
|
+
|
2113
1852
|
/** Get Balloon Popup Element to access any API provided.
|
2114
1853
|
* @public
|
2115
1854
|
* @return {Popup|null}
|
2116
1855
|
*/
|
2117
|
-
|
2118
|
-
|
2119
1856
|
InCellEditingPlugin.prototype.getBalloonPopup = function () {
|
2120
1857
|
// TODO: since we have balloonPopup per each column
|
2121
1858
|
// we should receive column index to return balloonPopup in specific column
|
2122
1859
|
return this._activeInCellCache ? this._activeInCellCache["balloonPopup"] : null;
|
2123
1860
|
};
|
1861
|
+
|
2124
1862
|
/** Get ef-autosuggest or atlas-autosuggest
|
2125
1863
|
* @public
|
2126
1864
|
* @return {Element}
|
2127
1865
|
*/
|
2128
|
-
|
2129
|
-
|
2130
1866
|
InCellEditingPlugin.prototype.getAutoSuggest = function () {
|
2131
1867
|
return this._autoSuggest;
|
2132
1868
|
};
|
1869
|
+
|
2133
1870
|
/**
|
2134
1871
|
* @public
|
2135
1872
|
* @param {boolean=} disabled
|
2136
1873
|
* @return {boolean} previous disablingScroll status
|
2137
1874
|
*/
|
2138
|
-
|
2139
|
-
|
2140
1875
|
InCellEditingPlugin.prototype.setDisablingScroll = function (disabled) {
|
2141
1876
|
var prev = disabled;
|
2142
1877
|
this._disablingScroll = disabled;
|
2143
1878
|
return prev;
|
2144
1879
|
};
|
1880
|
+
|
2145
1881
|
/** stop scrolling to move to prevent editor close
|
2146
1882
|
* @private
|
2147
1883
|
* @param {Object} grid grid instance
|
2148
1884
|
* @param {boolean=} frozen
|
2149
1885
|
*/
|
2150
|
-
|
2151
|
-
|
2152
1886
|
InCellEditingPlugin.prototype._freezeScrolling = function (grid, frozen) {
|
2153
1887
|
if (!grid) return;
|
2154
1888
|
var vs = grid.getVScrollbar();
|
@@ -2156,76 +1890,58 @@ InCellEditingPlugin.prototype._freezeScrolling = function (grid, frozen) {
|
|
2156
1890
|
vs && vs.freezeScrolling(frozen);
|
2157
1891
|
hs && hs.freezeScrolling(frozen);
|
2158
1892
|
};
|
1893
|
+
|
2159
1894
|
/** Set a timer to call onUpdateEditorPopup only once to avoid performance issue
|
2160
1895
|
* @public
|
2161
1896
|
*/
|
2162
|
-
|
2163
|
-
|
2164
1897
|
InCellEditingPlugin.prototype.requestShowEditorPopup = function () {
|
2165
1898
|
if (!this._editorTimerId) {
|
2166
1899
|
this._editorTimerId = setTimeout(this._onUpdateEditorPopup.bind(this), 100);
|
2167
1900
|
}
|
2168
1901
|
};
|
2169
|
-
/** @private */
|
2170
|
-
|
2171
1902
|
|
1903
|
+
/** @private */
|
2172
1904
|
InCellEditingPlugin.prototype._onUpdateEditorPopup = function () {
|
2173
1905
|
this._editorTimerId = 0;
|
2174
|
-
|
2175
1906
|
var grid = this.getActiveGrid() || this._lastActiveGrid;
|
2176
|
-
|
2177
1907
|
if (!grid) {
|
2178
1908
|
return;
|
2179
1909
|
}
|
2180
|
-
|
2181
1910
|
var parentElement = document.body;
|
2182
|
-
|
2183
1911
|
if (this._compositeGrid || this._realTimeGrid) {
|
2184
1912
|
parentElement = grid.getElement().parentElement;
|
2185
1913
|
}
|
2186
|
-
|
2187
1914
|
if (this._activeInCellCache) {
|
2188
1915
|
var activePos = this._activePos;
|
2189
|
-
|
2190
1916
|
if (activePos) {
|
2191
1917
|
var section = grid.getSection(activePos["sectionType"]);
|
2192
1918
|
var cell = section.getCell(activePos["colIndex"], activePos["rowIndex"]);
|
2193
|
-
|
2194
1919
|
if (cell) {
|
2195
1920
|
var popup = this._activeInCellCache["balloonPopup"];
|
2196
1921
|
popup.attachTo(cell.getElement());
|
2197
1922
|
popup.show(true, parentElement);
|
2198
|
-
|
2199
1923
|
this._updateEditorPopup(this._activeInCellCache, cell, grid);
|
2200
1924
|
}
|
2201
1925
|
}
|
2202
1926
|
} else if (this._activeRowId) {
|
2203
1927
|
var sectionContent = grid.getSection("content");
|
2204
|
-
|
2205
1928
|
var rowIndex = this._getRowIndex(this._activeRowId);
|
2206
|
-
|
2207
1929
|
if (sectionContent.isRowVisible(rowIndex)) {
|
2208
1930
|
var lastIndex = (sectionContent.getColumnCount() || 0) - 1;
|
2209
|
-
|
2210
1931
|
for (var columnIndex = 0; columnIndex <= lastIndex; columnIndex++) {
|
2211
1932
|
var columnData = this._getColumnData(columnIndex, grid);
|
2212
|
-
|
2213
1933
|
var inCellCache = columnData["inCellCache"];
|
2214
1934
|
var cellContent = sectionContent.getCell(columnIndex, rowIndex);
|
2215
|
-
|
2216
1935
|
if (!inCellCache || !cellContent) {
|
2217
1936
|
continue;
|
2218
1937
|
}
|
2219
|
-
|
2220
1938
|
var popupCache = inCellCache["balloonPopup"];
|
2221
1939
|
popupCache.attachTo(cellContent.getElement());
|
2222
1940
|
popupCache.show(true, parentElement);
|
2223
|
-
|
2224
1941
|
this._updateEditorPopup(inCellCache, cellContent, grid);
|
2225
1942
|
}
|
2226
1943
|
}
|
2227
1944
|
}
|
2228
|
-
|
2229
1945
|
grid.focus();
|
2230
1946
|
};
|
2231
1947
|
/** Update editor popup position and styles
|
@@ -2234,8 +1950,6 @@ InCellEditingPlugin.prototype._onUpdateEditorPopup = function () {
|
|
2234
1950
|
* @param {Object} cell
|
2235
1951
|
* @param {Object} grid grid instance
|
2236
1952
|
*/
|
2237
|
-
|
2238
|
-
|
2239
1953
|
InCellEditingPlugin.prototype._updateEditorPopup = function (contentEditor, cell, grid) {
|
2240
1954
|
var popup = contentEditor["balloonPopup"];
|
2241
1955
|
var editor = contentEditor["editor"];
|
@@ -2254,10 +1968,8 @@ InCellEditingPlugin.prototype._updateEditorPopup = function (contentEditor, cell
|
|
2254
1968
|
var displayStyle = "inline-block";
|
2255
1969
|
var marginLeft = 0;
|
2256
1970
|
var marginTop = 0;
|
2257
|
-
|
2258
1971
|
if (colRect.leftPinnedIndex != -1) {
|
2259
1972
|
var diff = 0;
|
2260
|
-
|
2261
1973
|
if (grid.getVScrollbar().isActive()) {
|
2262
1974
|
diff -= 8; // If column is left pinned, scrollbar width need to be subtracted
|
2263
1975
|
}
|
@@ -2266,7 +1978,6 @@ InCellEditingPlugin.prototype._updateEditorPopup = function (contentEditor, cell
|
|
2266
1978
|
offsetWidth += diff;
|
2267
1979
|
offsetLeft += diff;
|
2268
1980
|
}
|
2269
|
-
|
2270
1981
|
if (editor.classList.contains("balloon") && !this._activeRowId) {
|
2271
1982
|
popupElem.style.display = "";
|
2272
1983
|
editor.style.width = "";
|
@@ -2276,45 +1987,39 @@ InCellEditingPlugin.prototype._updateEditorPopup = function (contentEditor, cell
|
|
2276
1987
|
marginTop = -4;
|
2277
1988
|
newWidth = popup.getElement().offsetWidth;
|
2278
1989
|
}
|
2279
|
-
|
2280
1990
|
if (!pos["hit"]) {
|
2281
1991
|
displayStyle = "none";
|
2282
1992
|
} else {
|
2283
1993
|
var acquiredWidth = pos["x"] + newWidth;
|
2284
|
-
var acquiredHeight = pos["y"] - offsetTop + newHeight;
|
1994
|
+
var acquiredHeight = pos["y"] - offsetTop + newHeight;
|
2285
1995
|
|
1996
|
+
// Left overflow
|
2286
1997
|
if (pos["x"] < offsetLeft) {
|
2287
1998
|
newWidth = newWidth - (offsetLeft - pos["x"]);
|
2288
1999
|
marginLeft = marginLeft + Math.abs(pos["x"] - offsetLeft);
|
2289
|
-
}
|
2290
|
-
|
2291
|
-
|
2000
|
+
}
|
2001
|
+
// Right overflow
|
2292
2002
|
if (acquiredWidth > offsetWidth) {
|
2293
2003
|
newWidth = newWidth - (acquiredWidth - offsetWidth);
|
2294
|
-
}
|
2295
|
-
|
2296
|
-
|
2004
|
+
}
|
2005
|
+
// Top overflow
|
2297
2006
|
if (pos["y"] < offsetTop) {
|
2298
2007
|
newHeight = newHeight + pos["y"] - offsetTop;
|
2299
2008
|
marginTop = marginTop + Math.abs(pos["y"] - offsetTop);
|
2300
|
-
}
|
2301
|
-
|
2302
|
-
|
2009
|
+
}
|
2010
|
+
// Bottom overflow
|
2303
2011
|
if (acquiredHeight > offsetHeight) {
|
2304
2012
|
newHeight = newHeight - (acquiredHeight - offsetHeight);
|
2305
2013
|
}
|
2306
|
-
|
2307
2014
|
if (newWidth < 48 && newWidth != width || newHeight < 16 && newHeight != height) {
|
2308
2015
|
displayStyle = "none";
|
2309
2016
|
}
|
2310
2017
|
}
|
2311
|
-
|
2312
2018
|
popupElem.style.display = displayStyle;
|
2313
2019
|
editor.style.width = newWidth ? newWidth + "px" : "";
|
2314
2020
|
editor.style.height = newHeight ? newHeight + "px" : "";
|
2315
2021
|
editor.style.marginLeft = marginLeft ? marginLeft + "px" : 0;
|
2316
2022
|
editor.style.marginTop = marginTop ? marginTop + "px" : 0;
|
2317
2023
|
};
|
2318
|
-
|
2319
2024
|
export default InCellEditingPlugin;
|
2320
2025
|
export { InCellEditingPlugin, InCellEditingPlugin as InCellEditing, InCellEditingPlugin as InCellEditingExtension };
|