devextreme
Version:
HTML5 JavaScript Component Suite for Responsive Web Development
1,113 lines (1,104 loc) • 124 kB
JavaScript
/**
* DevExtreme (ui/grid_core/ui.grid_core.editing.js)
* Version: 20.1.7
* Build date: Tue Aug 25 2020
*
* Copyright (c) 2012 - 2020 Developer Express Inc. ALL RIGHTS RESERVED
* Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
*/
"use strict";
var _renderer = require("../../core/renderer");
var _renderer2 = _interopRequireDefault(_renderer);
var _dom_adapter = require("../../core/dom_adapter");
var _dom_adapter2 = _interopRequireDefault(_dom_adapter);
var _window = require("../../core/utils/window");
var _events_engine = require("../../events/core/events_engine");
var _events_engine2 = _interopRequireDefault(_events_engine);
var _guid = require("../../core/guid");
var _guid2 = _interopRequireDefault(_guid);
var _type = require("../../core/utils/type");
var _type2 = _interopRequireDefault(_type);
var _iterator = require("../../core/utils/iterator");
var _extend = require("../../core/utils/extend");
var _uiGrid_core = require("./ui.grid_core.modules");
var _uiGrid_core2 = _interopRequireDefault(_uiGrid_core);
var _click = require("../../events/click");
var _click2 = _interopRequireDefault(_click);
var _double_click = require("../../events/double_click");
var _double_click2 = _interopRequireDefault(_double_click);
var _pointer = require("../../events/pointer");
var _pointer2 = _interopRequireDefault(_pointer);
var _uiGrid_core3 = require("./ui.grid_core.utils");
var _utils = require("../../events/utils");
var _dialog = require("../dialog");
var _dialog2 = _interopRequireDefault(_dialog);
var _message = require("../../localization/message");
var _message2 = _interopRequireDefault(_message);
var _button = require("../button");
var _button2 = _interopRequireDefault(_button);
var _popup = require("../popup");
var _popup2 = _interopRequireDefault(_popup);
var _ui = require("../widget/ui.errors");
var _ui2 = _interopRequireDefault(_ui);
var _devices = require("../../core/devices");
var _devices2 = _interopRequireDefault(_devices);
var _form = require("../form");
var _form2 = _interopRequireDefault(_form);
var _hold = require("../../events/hold");
var _hold2 = _interopRequireDefault(_hold);
var _deferred = require("../../core/utils/deferred");
var _deferred2 = _interopRequireDefault(_deferred);
var _common = require("../../core/utils/common");
var _common2 = _interopRequireDefault(_common);
var _icon = require("../../core/utils/icon");
var _icon2 = _interopRequireDefault(_icon);
var _ui3 = require("../scroll_view/ui.scrollable");
var _ui4 = _interopRequireDefault(_ui3);
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
"default": obj
}
}
function _toConsumableArray(arr) {
return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread()
}
function _nonIterableSpread() {
throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")
}
function _unsupportedIterableToArray(o, minLen) {
if (!o) {
return
}
if ("string" === typeof o) {
return _arrayLikeToArray(o, minLen)
}
var n = Object.prototype.toString.call(o).slice(8, -1);
if ("Object" === n && o.constructor) {
n = o.constructor.name
}
if ("Map" === n || "Set" === n) {
return Array.from(o)
}
if ("Arguments" === n || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) {
return _arrayLikeToArray(o, minLen)
}
}
function _iterableToArray(iter) {
if ("undefined" !== typeof Symbol && Symbol.iterator in Object(iter)) {
return Array.from(iter)
}
}
function _arrayWithoutHoles(arr) {
if (Array.isArray(arr)) {
return _arrayLikeToArray(arr)
}
}
function _arrayLikeToArray(arr, len) {
if (null == len || len > arr.length) {
len = arr.length
}
for (var i = 0, arr2 = new Array(len); i < len; i++) {
arr2[i] = arr[i]
}
return arr2
}
var EDIT_FORM_CLASS = "edit-form";
var EDIT_FORM_ITEM_CLASS = "edit-form-item";
var FOCUS_OVERLAY_CLASS = "focus-overlay";
var READONLY_CLASS = "readonly";
var EDIT_POPUP_CLASS = "edit-popup";
var FORM_BUTTONS_CONTAINER_CLASS = "form-buttons-container";
var ADD_ROW_BUTTON_CLASS = "addrow-button";
var DROPDOWN_EDITOR_OVERLAY_CLASS = "dx-dropdowneditor-overlay";
var LINK_CLASS = "dx-link";
var EDITOR_CELL_CLASS = "dx-editor-cell";
var ROW_SELECTED = "dx-selection";
var EDIT_ROW = "dx-edit-row";
var EDIT_BUTTON_CLASS = "dx-edit-button";
var COMMAND_EDIT_CLASS = "dx-command-edit";
var COMMAND_EDIT_WITH_ICONS_CLASS = COMMAND_EDIT_CLASS + "-with-icons";
var SCROLLABLE_CONTAINER_CLASS = "dx-scrollable-container";
var BUTTON_CLASS = "dx-button";
var INSERT_INDEX = "__DX_INSERT_INDEX__";
var ROW_CLASS = "dx-row";
var ROW_REMOVED = "dx-row-removed";
var ROW_INSERTED = "dx-row-inserted";
var ROW_MODIFIED = "dx-row-modified";
var CELL_MODIFIED = "dx-cell-modified";
var CELL_HIGHLIGHT_OUTLINE = "dx-highlight-outline";
var EDITING_NAMESPACE = "dxDataGridEditing";
var DATA_ROW_CLASS = "dx-data-row";
var CELL_FOCUS_DISABLED_CLASS = "dx-cell-focus-disabled";
var EDITORS_INPUT_SELECTOR = "input:not([type='hidden'])";
var FOCUSABLE_ELEMENT_SELECTOR = "[tabindex], " + EDITORS_INPUT_SELECTOR;
var EDIT_MODE_BATCH = "batch";
var EDIT_MODE_ROW = "row";
var EDIT_MODE_CELL = "cell";
var EDIT_MODE_FORM = "form";
var EDIT_MODE_POPUP = "popup";
var DATA_EDIT_DATA_INSERT_TYPE = "insert";
var DATA_EDIT_DATA_UPDATE_TYPE = "update";
var DATA_EDIT_DATA_REMOVE_TYPE = "remove";
var POINTER_EVENTS_TARGET_CLASS = "dx-pointer-events-target";
var DEFAULT_START_EDIT_ACTION = "click";
var EDIT_MODES = [EDIT_MODE_BATCH, EDIT_MODE_ROW, EDIT_MODE_CELL, EDIT_MODE_FORM, EDIT_MODE_POPUP];
var ROW_BASED_MODES = [EDIT_MODE_ROW, EDIT_MODE_FORM, EDIT_MODE_POPUP];
var CELL_BASED_MODES = [EDIT_MODE_BATCH, EDIT_MODE_CELL];
var FORM_BASED_MODES = [EDIT_MODE_FORM, EDIT_MODE_POPUP];
var MODES_WITH_DELAYED_FOCUS = [EDIT_MODE_ROW, EDIT_MODE_FORM];
var TARGET_COMPONENT_NAME = "targetComponent";
var EDIT_LINK_CLASS = {
save: "dx-link-save",
cancel: "dx-link-cancel",
edit: "dx-link-edit",
undelete: "dx-link-undelete",
"delete": "dx-link-delete",
add: "dx-link-add"
};
var EDIT_ICON_CLASS = {
save: "save",
cancel: "revert",
edit: "edit",
undelete: "revert",
"delete": "trash",
add: "add"
};
var METHOD_NAMES = {
edit: "editRow",
"delete": "deleteRow",
undelete: "undeleteRow",
save: "saveEditData",
cancel: "cancelEditData",
add: "addRowByRowIndex"
};
var ACTION_OPTION_NAMES = {
add: "allowAdding",
edit: "allowUpdating",
"delete": "allowDeleting"
};
var BUTTON_NAMES = ["edit", "save", "cancel", "delete", "undelete"];
var EDITING_POPUP_OPTION_NAME = "editing.popup";
var createFailureHandler = function(deferred) {
return function(arg) {
var error = arg instanceof Error ? arg : new Error(arg && String(arg) || "Unknown error");
deferred.reject(error)
}
};
var _getEditMode = function(that) {
var editMode = that.option("editing.mode");
if (EDIT_MODES.indexOf(editMode) !== -1) {
return editMode
}
return EDIT_MODE_ROW
};
var _isRowEditMode = function(that) {
var editMode = _getEditMode(that);
return ROW_BASED_MODES.indexOf(editMode) !== -1
};
var EditingController = _uiGrid_core2.default.ViewController.inherit(function() {
var getDefaultEditorTemplate = function(that) {
return function(container, options) {
var $editor = (0, _renderer2.default)("<div>").appendTo(container);
that.getController("editorFactory").createEditor($editor, (0, _extend.extend)({}, options.column, {
value: options.value,
setValue: options.setValue,
row: options.row,
parentType: "dataRow",
width: null,
readOnly: !options.setValue,
isOnForm: options.isOnForm,
id: options.id
}))
}
};
var getEditingTexts = function(options) {
var editingTexts = options.component.option("editing.texts") || {};
return {
save: editingTexts.saveRowChanges,
cancel: editingTexts.cancelRowChanges,
edit: editingTexts.editRow,
undelete: editingTexts.undeleteRow,
"delete": editingTexts.deleteRow,
add: editingTexts.addRowToNode
}
};
var getButtonIndex = function(buttons, name) {
var result = -1;
buttons.some(function(button, index) {
if (getButtonName(button) === name) {
result = index;
return true
}
});
return result
};
function getButtonName(button) {
return _type2.default.isObject(button) ? button.name : button
}
var getEditorType = function(item) {
var column = item.column;
return item.isCustomEditorType ? item.editorType : column.formItem && column.formItem.editorType
};
var forEachFormItems = function forEachFormItems(items, callBack) {
items.forEach(function(item) {
if (item.items || item.tabs) {
forEachFormItems(item.items || item.tabs, callBack)
} else {
callBack(item)
}
})
};
return {
init: function() {
var that = this;
that._editRowIndex = -1;
that._editData = [];
that._editColumnIndex = -1;
that._columnsController = that.getController("columns");
that._dataController = that.getController("data");
that._rowsView = that.getView("rowsView");
that._editForm = null;
that._updateEditFormDeferred = null;
that._lastOperation = null;
if (that._deferreds) {
that._deferreds.forEach(function(d) {
return d.reject("cancel")
})
}
that._deferreds = [];
if (!that._dataChangedHandler) {
that._dataChangedHandler = that._handleDataChanged.bind(that);
that._dataController.changed.add(that._dataChangedHandler)
}
if (!that._saveEditorHandler) {
that.createAction("onInitNewRow", {
excludeValidators: ["disabled", "readOnly"]
});
that.createAction("onRowInserting", {
excludeValidators: ["disabled", "readOnly"]
});
that.createAction("onRowInserted", {
excludeValidators: ["disabled", "readOnly"]
});
that.createAction("onEditingStart", {
excludeValidators: ["disabled", "readOnly"]
});
that.createAction("onRowUpdating", {
excludeValidators: ["disabled", "readOnly"]
});
that.createAction("onRowUpdated", {
excludeValidators: ["disabled", "readOnly"]
});
that.createAction("onRowRemoving", {
excludeValidators: ["disabled", "readOnly"]
});
that.createAction("onRowRemoved", {
excludeValidators: ["disabled", "readOnly"]
});
var $pointerDownTarget;
var isResizing;
that._pointerUpEditorHandler = function() {
var _that$getController;
isResizing = null === (_that$getController = that.getController("columnsResizer")) || void 0 === _that$getController ? void 0 : _that$getController.isResizing()
};
that._pointerDownEditorHandler = function(e) {
return $pointerDownTarget = (0, _renderer2.default)(e.target)
};
that._saveEditorHandler = that.createAction(function(e) {
var event = e.event;
var $target = (0, _renderer2.default)(event.target);
var targetComponent = event[TARGET_COMPONENT_NAME];
if ($pointerDownTarget && $pointerDownTarget.is("input") && !$pointerDownTarget.is($target)) {
return
}
function checkEditorPopup($element) {
return $element && !!$element.closest(".".concat(DROPDOWN_EDITOR_OVERLAY_CLASS)).length
}
if (!_isRowEditMode(that) && !that._editCellInProgress) {
var isEditorPopup = checkEditorPopup($target) || checkEditorPopup(null === targetComponent || void 0 === targetComponent ? void 0 : targetComponent.$element());
var isDomElement = !!$target.closest((0, _window.getWindow)().document).length;
var isAnotherComponent = targetComponent && !targetComponent._disposed && targetComponent !== that.component;
var isAddRowButton = !!$target.closest(".".concat(that.addWidgetPrefix(ADD_ROW_BUTTON_CLASS))).length;
var isFocusOverlay = $target.hasClass(that.addWidgetPrefix(FOCUS_OVERLAY_CLASS));
var isCellEditMode = _getEditMode(that) === EDIT_MODE_CELL;
if (!isResizing && !isEditorPopup && !isFocusOverlay && !(isAddRowButton && isCellEditMode && that.isEditing()) && (isDomElement || isAnotherComponent)) {
that._closeEditItem.bind(that)($target)
}
}
});
_events_engine2.default.on(_dom_adapter2.default.getDocument(), _pointer2.default.up, that._pointerUpEditorHandler);
_events_engine2.default.on(_dom_adapter2.default.getDocument(), _pointer2.default.down, that._pointerDownEditorHandler);
_events_engine2.default.on(_dom_adapter2.default.getDocument(), _click2.default.name, that._saveEditorHandler)
}
that._updateEditColumn();
that._updateEditButtons()
},
getUpdatedData: function(data) {
var key = this._dataController.keyOf(data);
var editData = this._editData;
var editIndex = (0, _uiGrid_core3.getIndexByKey)(key, editData);
if (editData[editIndex]) {
return (0, _uiGrid_core3.createObjectWithChanges)(data, editData[editIndex].data)
}
return data
},
getInsertedData: function() {
return this._editData.filter(function(editData) {
return editData.data && editData.type === DATA_EDIT_DATA_INSERT_TYPE
}).map(function(editData) {
return editData.data
})
},
getRemovedData: function() {
return this._editData.filter(function(editData) {
return editData.oldData && editData.type === DATA_EDIT_DATA_REMOVE_TYPE
}).map(function(editData) {
return editData.oldData
})
},
_fireDataErrorOccurred: function(arg) {
if ("cancel" === arg) {
return
}
var $popupContent = this.getPopupContent();
this._dataController.dataErrorOccurred.fire(arg, $popupContent)
},
_needToCloseEditableCell: function($targetElement) {
var $element = this.component.$element();
var result = this.isEditing();
var isCurrentComponentElement = !$element || !!$targetElement.closest($element).length;
if (isCurrentComponentElement) {
var isDataRow = $targetElement.closest("." + DATA_ROW_CLASS).length;
if (isDataRow) {
var rowsView = this.getView("rowsView");
var $targetCell = $targetElement.closest("." + ROW_CLASS + "> td");
var rowIndex = rowsView.getRowIndex($targetCell.parent());
var columnIndex = rowsView.getCellElements(rowIndex).index($targetCell);
var visibleColumns = this._columnsController.getVisibleColumns();
var allowEditing = visibleColumns[columnIndex] && visibleColumns[columnIndex].allowEditing;
result = result && !allowEditing && !this.isEditCell(rowIndex, columnIndex)
}
}
return result
},
_closeEditItem: function($targetElement) {
if (this._needToCloseEditableCell($targetElement)) {
this.closeEditCell()
}
},
_handleDataChanged: function(args) {
var that = this;
var editForm = that._editForm;
if ("standard" === that.option("scrolling.mode")) {
that.resetRowAndPageIndices()
}
if ("prepend" === args.changeType) {
(0, _iterator.each)(that._editData, function(_, editData) {
editData.rowIndex += args.items.length
})
}
if ("refresh" === args.changeType && _getEditMode(that) === EDIT_MODE_POPUP && editForm && editForm.option("visible")) {
this._repaintEditPopup()
}
},
_isDefaultButtonVisible: function(button, options) {
var result = true;
var isRowMode = _isRowEditMode(this);
var isEditRow = options.row && options.row.rowIndex === this._getVisibleEditRowIndex() && isRowMode;
switch (button.name) {
case "edit":
result = !isEditRow && this.allowUpdating(options) && isRowMode;
break;
case "save":
case "cancel":
result = isEditRow;
break;
case "delete":
result = !isEditRow && this.allowDeleting(options) && !options.row.removed;
break;
case "undelete":
result = this.allowDeleting(options) && options.row.removed
}
return result
},
_isButtonVisible: function(button, options) {
var visible = button.visible;
if (!_type2.default.isDefined(visible)) {
return this._isDefaultButtonVisible(button, options)
}
return _type2.default.isFunction(visible) ? visible.call(button, {
component: options.component,
row: options.row,
column: options.column
}) : visible
},
_getButtonConfig: function(button, options) {
var _this = this;
var config = _type2.default.isObject(button) ? button : {};
var buttonName = getButtonName(button);
var editingTexts = getEditingTexts(options);
var methodName = METHOD_NAMES[buttonName];
var editingOptions = this.option("editing");
var actionName = ACTION_OPTION_NAMES[buttonName];
var allowAction = actionName ? editingOptions[actionName] : true;
return (0, _extend.extend)({
name: buttonName,
text: editingTexts[buttonName],
cssClass: EDIT_LINK_CLASS[buttonName],
onClick: function(e) {
var event = e.event;
event.stopPropagation();
event.preventDefault();
setTimeout(function() {
options.row && allowAction && _this[methodName] && _this[methodName](options.row.rowIndex)
})
}
}, config)
},
_getEditingButtons: function(options) {
var _this2 = this;
var buttonIndex;
var haveCustomButtons = !!options.column.buttons;
var buttons = (options.column.buttons || []).slice();
if (haveCustomButtons) {
buttonIndex = getButtonIndex(buttons, "edit");
if (buttonIndex >= 0) {
if (getButtonIndex(buttons, "save") < 0) {
buttons.splice(buttonIndex + 1, 0, "save")
}
if (getButtonIndex(buttons, "cancel") < 0) {
buttons.splice(getButtonIndex(buttons, "save") + 1, 0, "cancel")
}
}
buttonIndex = getButtonIndex(buttons, "delete");
if (buttonIndex >= 0 && getButtonIndex(buttons, "undelete") < 0) {
buttons.splice(buttonIndex + 1, 0, "undelete")
}
} else {
buttons = BUTTON_NAMES.slice()
}
return buttons.map(function(button) {
return _this2._getButtonConfig(button, options)
})
},
_renderEditingButtons: function($container, buttons, options) {
var _this3 = this;
buttons.forEach(function(button) {
if (_this3._isButtonVisible(button, options)) {
_this3._createButton($container, button, options)
}
})
},
_getEditCommandCellTemplate: function() {
var _this4 = this;
return function(container, options) {
var $container = (0, _renderer2.default)(container);
if ("data" === options.rowType) {
var buttons = _this4._getEditingButtons(options);
_this4._renderEditingButtons($container, buttons, options);
options.watch && options.watch(function() {
return buttons.map(function(button) {
return _this4._isButtonVisible(button, options)
})
}, function() {
$container.empty();
_this4._renderEditingButtons($container, buttons, options)
})
} else {
(0, _uiGrid_core3.setEmptyText)($container)
}
}
},
correctEditRowIndexAfterExpand: function(key) {
if (this._editRowIndex > this._dataController.getRowIndexByKey(key)) {
this._editRowIndex++
}
},
correctEditRowIndex: function(getRowIndexCorrection) {
this._editRowIndex += getRowIndexCorrection(this._getVisibleEditRowIndex())
},
isRowEditMode: function() {
return _isRowEditMode(this)
},
isFormEditMode: function() {
var editMode = _getEditMode(this);
return FORM_BASED_MODES.indexOf(editMode) !== -1
},
isCellOrBatchEditMode: function() {
var editMode = this.getEditMode();
return editMode === EDIT_MODE_BATCH || editMode === EDIT_MODE_CELL
},
getEditMode: function() {
return _getEditMode(this)
},
getFirstEditableColumnIndex: function() {
var columnsController = this.getController("columns");
var firstFormItem = this._firstFormItem;
var columnIndex;
if (_getEditMode(this) === EDIT_MODE_FORM && firstFormItem) {
var $editFormElements = this._rowsView.getCellElements(this._editRowIndex);
columnIndex = this._rowsView._getEditFormEditorVisibleIndex($editFormElements, firstFormItem.column)
} else {
var visibleColumns = columnsController.getVisibleColumns();
(0, _iterator.each)(visibleColumns, function(index, column) {
if (column.allowEditing) {
columnIndex = index;
return false
}
})
}
return columnIndex
},
getFirstEditableCellInRow: function(rowIndex) {
var rowsView = this.getView("rowsView");
return rowsView && rowsView._getCellElement(rowIndex ? rowIndex : 0, this.getFirstEditableColumnIndex())
},
getFocusedCellInRow: function(rowIndex) {
return this.getFirstEditableCellInRow(rowIndex)
},
getIndexByKey: function(key, items) {
return (0, _uiGrid_core3.getIndexByKey)(key, items)
},
hasChanges: function(rowIndex) {
var that = this;
var result = false;
for (var i = 0; i < that._editData.length; i++) {
if (that._editData[i].type && (!_type2.default.isDefined(rowIndex) || that._dataController.getRowIndexByKey(that._editData[i].key) === rowIndex)) {
result = true;
break
}
}
return result
},
dispose: function() {
this.callBase();
clearTimeout(this._inputFocusTimeoutID);
_events_engine2.default.off(_dom_adapter2.default.getDocument(), _pointer2.default.up, this._pointerUpEditorHandler);
_events_engine2.default.off(_dom_adapter2.default.getDocument(), _pointer2.default.down, this._pointerDownEditorHandler);
_events_engine2.default.off(_dom_adapter2.default.getDocument(), _click2.default.name, this._saveEditorHandler)
},
optionChanged: function(args) {
if ("editing" === args.name) {
var fullName = args.fullName;
var editPopup = this._editPopup;
if (fullName && 0 === fullName.indexOf(EDITING_POPUP_OPTION_NAME)) {
if (editPopup) {
var popupOptionName = fullName.slice(EDITING_POPUP_OPTION_NAME.length + 1);
if (popupOptionName) {
editPopup.option(popupOptionName, args.value)
} else {
editPopup.option(args.value)
}
}
} else {
if (editPopup && editPopup.option("visible") && 0 === fullName.indexOf("editing.form")) {
this._repaintEditPopup()
} else {
this.init()
}
}
args.handled = true
} else {
this.callBase(args)
}
},
publicMethods: function() {
return ["insertRow", "addRow", "removeRow", "deleteRow", "undeleteRow", "editRow", "editCell", "closeEditCell", "saveEditData", "cancelEditData", "hasEditData"]
},
refresh: function(isPageChanged) {
var editMode = _getEditMode(this);
var needResetIndexes = editMode === EDIT_MODE_BATCH || isPageChanged && "virtual" !== this.option("scrolling.mode");
if (editMode !== EDIT_MODE_BATCH && editMode !== EDIT_MODE_CELL) {
this.init()
} else {
if (needResetIndexes) {
this._editRowIndex = -1;
this._editColumnIndex = -1
}
}
},
isEditing: function() {
return this._editRowIndex > -1
},
isEditRow: function(rowIndex) {
var editMode = _getEditMode(this);
return this._getVisibleEditRowIndex() === rowIndex && ROW_BASED_MODES.indexOf(editMode) !== -1
},
getEditRowKey: function() {
var items = this._dataController.items();
var item = items[this._getVisibleEditRowIndex()];
return item && item.key
},
getEditRowIndex: function() {
return this._getVisibleEditRowIndex()
},
getEditFormRowIndex: function() {
var editMode = _getEditMode(this);
return editMode === EDIT_MODE_FORM || editMode === EDIT_MODE_POPUP ? this._getVisibleEditRowIndex() : -1
},
isEditCell: function(visibleRowIndex, columnIndex) {
var hasEditData = !!(Array.isArray(this._editData) && this._editData.length);
return hasEditData && this._getVisibleEditRowIndex() === visibleRowIndex && this._editColumnIndex === columnIndex
},
getPopupContent: function() {
var editMode = _getEditMode(this);
var popupVisible = this._editPopup && this._editPopup.option("visible");
if (editMode === EDIT_MODE_POPUP && popupVisible) {
return this._$popupContent
}
},
getEditForm: function() {
return this._editForm
},
_needInsertItem: function(editData, changeType) {
var that = this;
var dataSource = that._dataController.dataSource();
var scrollingMode = that.option("scrolling.mode");
var pageIndex = dataSource.pageIndex();
var beginPageIndex = dataSource.beginPageIndex ? dataSource.beginPageIndex() : pageIndex;
var endPageIndex = dataSource.endPageIndex ? dataSource.endPageIndex() : pageIndex;
if ("standard" !== scrollingMode) {
switch (changeType) {
case "append":
return editData.key.pageIndex === endPageIndex;
case "prepend":
return editData.key.pageIndex === beginPageIndex;
case "refresh":
editData.key.rowIndex = 0;
editData.key.dataRowIndex = 0;
editData.key.pageIndex = 0;
break;
default:
return editData.key.pageIndex >= beginPageIndex && editData.key.pageIndex <= endPageIndex
}
}
return editData.key.pageIndex === pageIndex
},
_generateNewItem: function(key) {
var item = {
key: key
};
if (key && key[INSERT_INDEX]) {
item[INSERT_INDEX] = key[INSERT_INDEX]
}
return item
},
processItems: function(items, change) {
var changeType = change.changeType;
var dataController = this._dataController;
var dataRowIndex = -1;
this.update(changeType);
var editData = this._editData;
for (var i = 0; i < editData.length; i++) {
var key = editData[i].key;
if (key) {
var rowIndexOffset = dataController.getRowIndexOffset();
dataRowIndex = key.dataRowIndex - rowIndexOffset + dataController.getRowIndexDelta();
if ("append" === changeType) {
dataRowIndex -= dataController.items(true).length;
if (change.removeCount) {
dataRowIndex += change.removeCount
}
}
var item = this._generateNewItem(key);
if (dataRowIndex >= 0 && editData[i].type === DATA_EDIT_DATA_INSERT_TYPE && this._needInsertItem(editData[i], changeType, items, item)) {
items.splice(key.dataRowIndex ? dataRowIndex : 0, 0, item)
}
}
}
return items
},
processDataItem: function(item, options, generateDataValues) {
var that = this;
var data;
var columns = options.visibleColumns;
var key = item.data[INSERT_INDEX] ? item.data.key : item.key;
var editIndex = (0, _uiGrid_core3.getIndexByKey)(key, that._editData);
item.isEditing = false;
if (editIndex >= 0) {
var editMode = _getEditMode(that);
var editData = that._editData[editIndex];
data = editData.data;
switch (editData.type) {
case DATA_EDIT_DATA_INSERT_TYPE:
if (editMode === EDIT_MODE_POPUP) {
item.visible = false
}
item.isNewRow = true;
item.key = key;
item.data = data;
break;
case DATA_EDIT_DATA_UPDATE_TYPE:
item.modified = true;
item.oldData = item.data;
item.data = (0, _uiGrid_core3.createObjectWithChanges)(item.data, data);
item.modifiedValues = generateDataValues(data, columns, true);
break;
case DATA_EDIT_DATA_REMOVE_TYPE:
if (editMode === EDIT_MODE_BATCH) {
item.data = (0, _uiGrid_core3.createObjectWithChanges)(item.data, data)
}
item.removed = true
}
}
},
insertRow: function() {
_ui2.default.log("W0002", "dxDataGrid", "insertRow", "15.2", "Use the 'addRow' method instead");
return this.addRow()
},
_initNewRow: function(options) {
var _this5 = this;
this.executeAction("onInitNewRow", options);
if (options.promise) {
var deferred = new _deferred.Deferred;
(0, _deferred.when)((0, _deferred.fromPromise)(options.promise)).done(deferred.resolve).fail(createFailureHandler(deferred)).fail(function(arg) {
return _this5._fireDataErrorOccurred(arg)
});
return deferred
}
},
_getInsertKey: function(parentKey) {
var that = this;
var dataController = that._dataController;
var rows = dataController.items();
var editMode = _getEditMode(that);
var insertKey = {
parentKey: parentKey,
pageIndex: dataController.pageIndex(),
rowIndex: that._getInsertRowIndex(parentKey)
};
var row = rows[insertKey.rowIndex];
if (row && (!row.isEditing && "detail" === row.rowType || "detailAdaptive" === row.rowType)) {
insertKey.rowIndex++
}
insertKey.dataRowIndex = dataController.getRowIndexOffset() + rows.filter(function(row, index) {
return index < insertKey.rowIndex && ("data" === row.rowType || "group" === row.rowType || row.isNewRow)
}).length;
if (editMode !== EDIT_MODE_BATCH) {
that._editRowIndex = insertKey.rowIndex + that._dataController.getRowIndexOffset()
}
insertKey[INSERT_INDEX] = that._getInsertIndex();
return insertKey
},
_getInsertRowIndex: function(parentKey) {
var that = this;
var rowsView = that.getView("rowsView");
var parentRowIndex = that._dataController.getRowIndexByKey(parentKey);
if (parentRowIndex >= 0) {
return parentRowIndex + 1
}
if (rowsView) {
return rowsView.getTopVisibleItemIndex(true)
}
return 0
},
_getInsertIndex: function() {
var maxInsertIndex = 0;
this._editData.forEach(function(editItem) {
if (editItem.type === DATA_EDIT_DATA_INSERT_TYPE && editItem.key[INSERT_INDEX] > maxInsertIndex) {
maxInsertIndex = editItem.key[INSERT_INDEX]
}
});
return maxInsertIndex + 1
},
addRow: function(parentKey) {
var that = this;
var dataController = that._dataController;
var store = dataController.store();
var key = store && store.key();
var param = {
data: {}
};
var editMode = _getEditMode(that);
var oldEditRowIndex = that._getVisibleEditRowIndex();
var deferred = new _deferred.Deferred;
if (!store) {
dataController.fireError("E1052", this.component.NAME);
return deferred.reject()
}
if (editMode === EDIT_MODE_CELL && that.hasChanges()) {
that.saveEditData().done(function() {
if (!that.hasChanges()) {
that.addRow(parentKey).done(deferred.resolve).fail(deferred.reject)
} else {
deferred.reject("cancel")
}
});
return deferred.promise()
}
that.refresh();
if (!that._allowRowAdding()) {
return deferred.reject("cancel")
}
if (!key) {
param.data.__KEY__ = String(new _guid2.default)
}(0, _deferred.when)(that._initNewRow(param, parentKey)).done(function() {
if (that._allowRowAdding()) {
that._addRowCore(param.data, parentKey, oldEditRowIndex);
deferred.resolve()
} else {
deferred.reject("cancel")
}
}).fail(deferred.reject);
return deferred.promise()
},
_allowRowAdding: function() {
var that = this;
var editMode = _getEditMode(that);
var insertIndex = that._getInsertIndex();
if (editMode !== EDIT_MODE_BATCH && insertIndex > 1) {
return false
}
return true
},
_addRowCore: function(data, parentKey, initialOldEditRowIndex) {
var that = this;
var oldEditRowIndex = that._getVisibleEditRowIndex();
var insertKey = that._getInsertKey(parentKey);
var editMode = _getEditMode(that);
that._addEditData({
key: insertKey,
data: data,
type: DATA_EDIT_DATA_INSERT_TYPE
});
that._dataController.updateItems({
changeType: "update",
rowIndices: [initialOldEditRowIndex, oldEditRowIndex, insertKey.rowIndex]
});
if (editMode === EDIT_MODE_POPUP) {
that._showEditPopup(insertKey.rowIndex)
} else {
that._focusFirstEditableCellInRow(insertKey.rowIndex)
}
that._afterInsertRow({
key: insertKey,
data: data
})
},
_focusFirstEditableCellInRow: function(rowIndex) {
var that = this;
var $firstCell = that.getFirstEditableCellInRow(rowIndex);
that._editCellInProgress = true;
that._delayedInputFocus($firstCell, function() {
that._editCellInProgress = false;
var $cell = that.getFirstEditableCellInRow(rowIndex);
var eventToTrigger = "dblClick" === that.option("editing.startEditAction") ? _double_click2.default.name : _click2.default.name;
$cell && _events_engine2.default.trigger($cell, eventToTrigger)
})
},
_isEditingStart: function(options) {
this.executeAction("onEditingStart", options);
return options.cancel
},
_beforeEditCell: function(rowIndex, columnIndex, item) {
var that = this;
if (_getEditMode(that) === EDIT_MODE_CELL && !item.isNewRow && that.hasChanges()) {
var d = new _deferred.Deferred;
that.saveEditData().always(function() {
d.resolve(that.hasChanges())
});
return d
}
},
_beforeUpdateItems: function() {},
_getVisibleEditRowIndex: function() {
return this._editRowIndex >= 0 ? this._editRowIndex - this._dataController.getRowIndexOffset() : -1
},
editRow: function(rowIndex) {
var that = this;
var dataController = that._dataController;
var items = dataController.items();
var item = items[rowIndex];
var params = {
data: item && item.data,
cancel: false
};
var oldEditRowIndex = that._getVisibleEditRowIndex();
var $editingCell;
if (!item) {
return
}
if (rowIndex === oldEditRowIndex) {
return true
}
if (!item.isNewRow) {
params.key = item.key
}
if (that._isEditingStart(params)) {
return
}
that.init();
that._pageIndex = dataController.pageIndex();
that._editRowIndex = (items[0].isNewRow ? rowIndex - 1 : rowIndex) + that._dataController.getRowIndexOffset();
that._addEditData({
data: {},
key: item.key,
oldData: item.data
});
var rowIndices = [oldEditRowIndex, rowIndex];
var editMode = _getEditMode(that);
that._beforeUpdateItems(rowIndices, rowIndex, oldEditRowIndex);
if (editMode === EDIT_MODE_POPUP) {
that._showEditPopup(rowIndex)
} else {
dataController.updateItems({
changeType: "update",
rowIndices: rowIndices
})
}
if (MODES_WITH_DELAYED_FOCUS.indexOf(editMode) !== -1) {
$editingCell = that.getFocusedCellInRow(that._getVisibleEditRowIndex());
that._delayedInputFocus($editingCell, function() {
$editingCell && that.component.focus($editingCell)
})
}
},
_showEditPopup: function(rowIndex, repaintForm) {
var that = this;
var isMobileDevice = "desktop" !== _devices2.default.current().deviceType;
var popupOptions = (0, _extend.extend)({
showTitle: false,
fullScreen: isMobileDevice,
toolbarItems: [{
toolbar: "bottom",
location: "after",
widget: "dxButton",
options: that._getSaveButtonConfig()
}, {
toolbar: "bottom",
location: "after",
widget: "dxButton",
options: that._getCancelButtonConfig()
}],
contentTemplate: that._getPopupEditFormTemplate(rowIndex)
}, that.option(EDITING_POPUP_OPTION_NAME));
if (!that._editPopup) {
var $popupContainer = (0, _renderer2.default)("<div>").appendTo(that.component.$element()).addClass(that.addWidgetPrefix(EDIT_POPUP_CLASS));
that._editPopup = that._createComponent($popupContainer, _popup2.default, {});
that._editPopup.on("hiding", that._getEditPopupHiddenHandler());
that._editPopup.on("shown", function(e) {
_events_engine2.default.trigger(e.component.$content().find(FOCUSABLE_ELEMENT_SELECTOR).not("." + SCROLLABLE_CONTAINER_CLASS).first(), "focus");
if (repaintForm) {
that._editForm && that._editForm.repaint()
}
})
}
that._editPopup.option(popupOptions);
that._editPopup.show()
},
_repaintEditPopup: function() {
var rowIndex = this._getVisibleEditRowIndex();
if (this._editPopup && this._editPopup.option("visible") && rowIndex >= 0) {
var defaultAnimation = this._editPopup.option("animation");
this._editPopup.option("animation", null);
this._showEditPopup(rowIndex, true);
this._editPopup.option("animation", defaultAnimation)
}
},
_getEditPopupHiddenHandler: function() {
var that = this;
return function(e) {
if (that.isEditing()) {
that.cancelEditData()
}
}
},
_getPopupEditFormTemplate: function(rowIndex) {
var that = this;
var row = that.component.getVisibleRows()[rowIndex];
var templateOptions = {
row: row,
rowType: row.rowType,
key: row.key
};
return function(container) {
var formTemplate = that.getEditFormTemplate();
var scrollable = that._createComponent((0, _renderer2.default)("<div>").appendTo(container), _ui4.default);
that._$popupContent = scrollable.$content();
formTemplate(that._$popupContent, templateOptions, true)
}
},
_getSaveButtonConfig: function() {
return {
text: this.option("editing.texts.saveRowChanges"),
onClick: this.saveEditData.bind(this)
}
},
_getCancelButtonConfig: function() {
return {
text: this.option("editing.texts.cancelRowChanges"),
onClick: this.cancelEditData.bind(this)
}
},
_removeEditDataItem: function(index) {
if (index >= 0) {
this._editData.splice(index, 1)
}
},
executeOperation: function(deferred, func) {
var _this6 = this;
this._lastOperation && this._lastOperation.reject();
this._lastOperation = deferred;
this.waitForDeferredOperations().done(function() {
if ("rejected" === deferred.state()) {
return
}
func();
_this6._lastOperation = null
}).fail(function() {
deferred.reject();
_this6._lastOperation = null
})
},
waitForDeferredOperations: function() {
return _deferred.when.apply(void 0, _toConsumableArray(this._deferreds))
},
editCell: function(rowIndex, columnIndex) {
var _this7 = this;
var d = new _deferred.Deferred;
var coreResult;
this.executeOperation(d, function() {
coreResult = _this7._editCellCore(rowIndex, columnIndex);
(0, _deferred.when)(coreResult).done(d.resolve).fail(d.reject)
});
return void 0 !== coreResult ? coreResult : d.promise()
},
_editCellCore: function(rowIndex, columnIndex) {
var that = this;
var columnsController = that._columnsController;
var dataController = that._dataController;
var items = dataController.items();
var item = items[rowIndex];
var params = {
data: item && item.data,
cancel: false
};
var oldEditRowIndex = that._getVisibleEditRowIndex();
var visibleColumns = columnsController.getVisibleColumns();
var oldColumn = visibleColumns[that._editColumnIndex];
if (_type2.default.isString(columnIndex)) {
columnIndex = columnsController.columnOption(columnIndex, "index");
columnIndex = columnsController.getVisibleIndex(columnIndex)
}
var column = params.column = visibleColumns[columnIndex];
if (column && item && ("data" === item.rowType || "detailAdaptive" === item.rowType) && !item.removed && !_isRowEditMode(that)) {
if (that.isEditCell(rowIndex, columnIndex)) {
return true
}
var editRowIndex = rowIndex + dataController.getRowIndexOffset();
return (0, _deferred.when)(that._beforeEditCell(rowIndex, columnIndex, item)).done(function(cancel) {
if (cancel) {
return
}
if (that._prepareEditCell(params, item, columnIndex, editRowIndex)) {
_common2.default.deferRender(function() {
that._repaintEditCell(column, oldColumn, oldEditRowIndex)
})
} else {
that._processCanceledEditingCell()
}
})
}
return false
},
_processCanceledEditingCell: function() {}