@syncfusion/ej2-treegrid - npm Package Compare versions

Comparing version 17.1.1-beta to 17.1.32-beta

CHANGELOG.md

@@ -7,4 +7,19 @@ # Changelog
 
+#### New Features
+
+- Checkbox selection support has been provided that allows users to select rows using checkbox.
+- Checkbox Column support has been provided that allows users to check rows using checkbox in treegrid column.
+
 #### Bug Fixes
 
+- Change detection for properties `dataSource` and `query` were handled for remote data.
+- Edited records can be searched/filtered.
+- Inner level records will be collapsed/expanded after filtering/searching actions.
+
+## 17.1.1-beta (2019-01-29)
+
+### TreeGrid
+
+#### Bug Fixes
+
 - `Query` maintenance support provided for `refresh` method after expanding any child rows.
@@ -11,0 +26,0 @@ - Property change support for `height` property has been provided.

dist/global/index.d.ts

 /*!
 *  filename: index.d.ts
-*  version : 17.1.1-beta
+*  version : 17.1.32-beta
 *  Copyright Syncfusion Inc. 2001 - 2019. All rights reserved.
@@ -5,0 +5,0 @@ *  Use of this code is subject to the terms of our license.

package.json

 {
   "name": "@syncfusion/ej2-treegrid",
-  "version": "17.1.1-beta",
+  "version": "17.1.32-beta",
   "description": "Essential JS 2 TreeGrid Component",
@@ -11,13 +11,8 @@ "author": "Syncfusion Inc.",
   "dependencies": {
-    "@syncfusion/ej2-base": "~17.1.1-beta",
-    "@syncfusion/ej2-data": "~17.1.1-beta",
-    "@syncfusion/ej2-popups": "~17.1.1-beta",
-    "@syncfusion/ej2-grids": "~17.1.1-beta"
+    "@syncfusion/ej2-base": "~17.1.32-beta",
+    "@syncfusion/ej2-data": "~17.1.32-beta",
+    "@syncfusion/ej2-popups": "~17.1.32-beta",
+    "@syncfusion/ej2-grids": "~17.1.32-beta"
   },
-  "devDependencies": {
-    "@types/chai": "^3.4.28",
-    "@types/jasmine": "2.8.9",
-    "@types/jasmine-ajax": "^3.1.27",
-    "@types/requirejs": "^2.1.26"
-  },
+  "devDependencies": {},
   "keywords": [
@@ -24,0 +19,0 @@ "ej2",

src/treegrid/actions/context-menu.d.ts

@@ -18,2 +18,3 @@ import { TreeGrid } from '../base';
     private contextMenuOpen;
+    private contextMenuClick;
     /**
@@ -20,0 +21,0 @@ * For internal use only - Get the module name.

src/treegrid/actions/context-menu.js

@@ -17,2 +17,3 @@ import { Grid, ContextMenu as cmenu } from '@syncfusion/ej2-grids';
         this.parent.on('contextMenuOpen', this.contextMenuOpen, this);
+        this.parent.on('contextMenuClick', this.contextMenuClick, this);
     };
@@ -27,2 +28,3 @@ /**
         this.parent.off('contextMenuOpen', this.contextMenuOpen);
+        this.parent.off('contextMenuClick', this.contextMenuClick);
     };
@@ -40,2 +42,9 @@ ContextMenu.prototype.contextMenuOpen = function (args) {
     };
+    ContextMenu.prototype.contextMenuClick = function (args) {
+        if (args.item.id === 'Above' || args.item.id === 'Below') {
+            this.parent.notify('savePreviousRowPosition', args);
+            this.parent.setProperties({ editSettings: { newRowPosition: args.item.id } }, true);
+            this.parent.addRecord();
+        }
+    };
     /**
@@ -42,0 +51,0 @@ * For internal use only - Get the module name.

src/treegrid/actions/edit.d.ts

@@ -15,2 +15,3 @@ import { Column } from '@syncfusion/ej2-grids';
     private doubleClickTarget;
+    private previousNewRowPosition;
     /**
@@ -44,3 +45,5 @@ * Constructor for Edit module
     private recordDoubleClick;
+    private updateGridEditMode;
     private keyPressed;
+    private deleteUniqueID;
     private cellEdit;
@@ -50,9 +53,7 @@ private enableToolbarItems;
     private cellSave;
+    private crudAction;
     private beginAdd;
     private beginEdit;
+    private savePreviousRowPosition;
     private beginAddEdit;
-    private addAction;
-    private editAction;
-    private removeChildRecords;
-    private updateParentRow;
     /**
@@ -59,0 +60,0 @@ * Checks the status of validation at the time of editing. If validation is passed, it returns true.

src/treegrid/actions/edit.js

@@ -1,2 +0,2 @@
-import { Grid, Edit as GridEdit, getUid } from '@syncfusion/ej2-grids';
+import { Grid, Edit as GridEdit, getUid, getObject } from '@syncfusion/ej2-grids';
 import * as events from '../base/constant';
@@ -6,3 +6,3 @@ import { isNullOrUndefined, extend, setValue, removeClass } from '@syncfusion/ej2-base';
 import { findChildrenRecords } from '../utils';
-import { getPlainData, extendArray } from '../utils';
+import { editAction, updateParentRow } from './crud-actions';
 /**
@@ -23,2 +23,3 @@ * TreeGrid Edit Module
         // this.isAdd = false;
+        this.previousNewRowPosition = null;
         this.addEventListener();
@@ -37,3 +38,3 @@ }
     Edit.prototype.addEventListener = function () {
-        this.parent.on(events.crudAction, this.editAction, this);
+        this.parent.on(events.crudAction, this.crudAction, this);
         this.parent.on(events.beginEdit, this.beginEdit, this);
@@ -47,2 +48,3 @@ this.parent.on(events.beginAdd, this.beginAdd, this);
         this.parent.grid.on(events.doubleTap, this.recordDoubleClick, this);
+        this.parent.on('savePreviousRowPosition', this.savePreviousRowPosition, this);
         // this.parent.on(events.beforeDataBound, this.beforeDataBound, this);
@@ -63,3 +65,3 @@ // this.parent.on(events.cellSaved, this.cellSaved, this);
         }
-        this.parent.off(events.crudAction, this.editAction);
+        this.parent.off(events.crudAction, this.crudAction);
         this.parent.off(events.beginEdit, this.beginEdit);
@@ -73,2 +75,3 @@ this.parent.off(events.beginAdd, this.beginAdd);
         this.parent.grid.off(events.doubleTap, this.recordDoubleClick);
+        this.parent.off('savePreviousRowPosition', this.savePreviousRowPosition);
     };
@@ -98,6 +101,11 @@ /**
             this.parent.grid.setProperties({ selectedRowIndex: args.rowIndex }, true);
-            this.parent.grid.editSettings.mode = 'Batch';
-            this.parent.grid.dataBind();
+            this.updateGridEditMode('Batch');
         }
     };
+    Edit.prototype.updateGridEditMode = function (mode) {
+        this.parent.grid.setProperties({ editSettings: { mode: mode } }, true);
+        var updateMethod = getObject('updateEditObj', this.parent.grid.editModule);
+        updateMethod.apply(this.parent.grid.editModule);
+        this.parent.grid.isEdit = false;
+    };
     Edit.prototype.keyPressed = function (args) {
@@ -108,2 +116,8 @@ if (this.isOnBatch) {
     };
+    Edit.prototype.deleteUniqueID = function (value) {
+        var idFilter = 'uniqueIDFilterCollection';
+        delete this.parent[idFilter][value];
+        var id = 'uniqueIDCollection';
+        delete this.parent[id][value];
+    };
     Edit.prototype.cellEdit = function (args) {
@@ -146,4 +160,3 @@ if (this.doubleClickTarget && (this.doubleClickTarget.classList.contains('e-treegridexpand') ||
             });
-            this.parent.grid.editSettings.mode = 'Normal';
-            this.parent.grid.dataBind();
+            this.updateGridEditMode('Normal');
             this.isOnBatch = false;
@@ -190,6 +203,8 @@ }
             this.parent.grid.editModule.updateRow(rowIndex_1, args.rowData);
+            if (this.parent.grid.aggregateModule) {
+                this.parent.grid.aggregateModule.refresh(args.rowData);
+            }
             this.parent.grid.editModule.formObj.destroy();
             if (this.keyPress !== 'tab' && this.keyPress !== 'shiftTab') {
-                this.parent.grid.editSettings.mode = 'Normal';
-                this.parent.grid.dataBind();
+                this.updateGridEditMode('Normal');
                 this.isOnBatch = false;
@@ -200,3 +215,3 @@ }
             removeClass(row.querySelectorAll('.e-rowcell'), ['e-editedbatchcell', 'e-updatedtd']);
-            this.editAction({ value: args.rowData, action: 'edit' });
+            editAction({ value: args.rowData, action: 'edit' }, this.parent, this.isSelfReference, this.addRowIndex, this.selectedIndex, args.columnName);
             var saveArgs = {
@@ -209,2 +224,9 @@ type: 'save', column: this.parent.getColumnByField(args.columnName), data: args.rowData,
     };
+    Edit.prototype.crudAction = function (details, columnName) {
+        editAction(details, this.parent, this.isSelfReference, this.addRowIndex, this.selectedIndex, columnName);
+        if (details.action === 'add' && this.previousNewRowPosition != null) {
+            this.parent.setProperties({ editSettings: { newRowPosition: this.previousNewRowPosition } }, true);
+            this.previousNewRowPosition = null;
+        }
+    };
     Edit.prototype.beginAdd = function (args) {
@@ -216,3 +238,4 @@ var position;
         if (this.parent.editSettings.mode !== 'Dialog') {
-            if (this.parent.editSettings.newRowPosition === 'Child' && !(records[index].expanded)) {
+            if (this.parent.editSettings.newRowPosition === 'Child' && !(records[index].expanded) &&
+                records[index].hasChildRecords) {
                 this.parent.expandRow(rows[index + 1], records[index]);
@@ -275,3 +298,3 @@ }
         if (this.doubleClickTarget && (this.doubleClickTarget.classList.contains('e-treegridexpand') ||
-            this.doubleClickTarget.classList.contains('e-treegridcollapse'))) {
+            this.doubleClickTarget.classList.contains('e-treegridcollapse') || this.doubleClickTarget.classList.contains('e-frame'))) {
             args.cancel = true;
@@ -284,3 +307,8 @@ this.doubleClickTarget = null;
             for (var i = 0; i < data.length; i++) {
-                args.data = data.concat(findChildrenRecords(data[i]));
+                this.deleteUniqueID(data[i].uniqueID);
+                var childs = findChildrenRecords(data[i]);
+                for (var c = 0; c < childs.length; c++) {
+                    this.deleteUniqueID(childs[c].uniqueID);
+                }
+                args.data = data.concat(childs);
             }
@@ -302,2 +330,7 @@ }
     };
+    Edit.prototype.savePreviousRowPosition = function (args) {
+        if (this.previousNewRowPosition === null) {
+            this.previousNewRowPosition = this.parent.editSettings.newRowPosition;
+        }
+    };
     Edit.prototype.beginAddEdit = function (args) {
@@ -313,2 +346,3 @@ var value = args.data;
             value.uniqueID = getUid(this.parent.element.id + '_data_');
+            setValue('uniqueIDCollection.' + value.uniqueID, value, this.parent);
             var level = void 0;
@@ -351,3 +385,3 @@ var dataIndex = void 0;
                         if (!isNullOrUndefined(value.parentItem)) {
-                            this.updateParentRow(key, value.parentItem, 'add', value);
+                            updateParentRow(key, value.parentItem, 'add', this.parent, this.isSelfReference, value);
                         }
@@ -367,3 +401,3 @@ }
                         if (!isNullOrUndefined(value.parentItem)) {
-                            this.updateParentRow(key, value.parentItem, 'add', value);
+                            updateParentRow(key, value.parentItem, 'add', this.parent, this.isSelfReference, value);
                         }
@@ -388,225 +422,2 @@ }
     };
-    Edit.prototype.addAction = function (details, treeData) {
-        var value;
-        var isSkip = false;
-        var currentViewRecords = this.parent.grid.getCurrentViewRecords();
-        value = extend({}, details.value);
-        value = getPlainData(value);
-        switch (this.parent.editSettings.newRowPosition) {
-            case 'Top':
-                treeData.unshift(value);
-                isSkip = true;
-                break;
-            case 'Bottom':
-                treeData.push(value);
-                isSkip = true;
-                break;
-            case 'Above':
-                value = currentViewRecords[this.addRowIndex + 1];
-                break;
-            case 'Below':
-            case 'Child':
-                value = currentViewRecords[this.addRowIndex];
-                if (this.selectedIndex === -1) {
-                    treeData.unshift(value);
-                    isSkip = true;
-                }
-        }
-        return { value: value, isSkip: isSkip };
-    };
-    Edit.prototype.editAction = function (details) {
-        var _this = this;
-        var value = details.value;
-        var action = details.action;
-        if (action === 'save') {
-            action = 'edit';
-        }
-        var i;
-        var j;
-        var key = this.parent.grid.getPrimaryKeyFieldNames()[0];
-        var treeData = this.parent.dataSource instanceof DataManager ?
-            this.parent.dataSource.dataSource.json : this.parent.dataSource;
-        var modifiedData = [];
-        var originalData = value;
-        var isSkip = false;
-        var currentViewRecords = this.parent.grid.getCurrentViewRecords();
-        if (action === 'add') {
-            var addAct = this.addAction(details, treeData);
-            value = addAct.value;
-            isSkip = addAct.isSkip;
-        }
-        if (value instanceof Array) {
-            modifiedData = extendArray(value);
-        }
-        else {
-            modifiedData.push(extend({}, value));
-        }
-        if (!isSkip && (action !== 'add' ||
-            (this.parent.editSettings.newRowPosition !== 'Top' && this.parent.editSettings.newRowPosition !== 'Bottom'))) {
-            for (var k = 0; k < modifiedData.length; k++) {
-                var keys = Object.keys(modifiedData[k]);
-                i = treeData.length;
-                var _loop_1 = function () {
-                    if (treeData[i][key] === modifiedData[k][key]) {
-                        if (action === 'delete') {
-                            var currentData_1 = treeData[i];
-                            treeData.splice(i, 1);
-                            if (this_1.isSelfReference) {
-                                if (!isNullOrUndefined(currentData_1[this_1.parent.parentIdMapping])) {
-                                    var parentData = this_1.parent.flatData.filter(function (e) {
-                                        return e[_this.parent.idMapping] === currentData_1[_this.parent.parentIdMapping];
-                                    })[0];
-                                    var childRecords = parentData ? parentData[this_1.parent.childMapping] : [];
-                                    for (var p = childRecords.length - 1; p >= 0; p--) {
-                                        if (childRecords[p][this_1.parent.idMapping] === currentData_1[this_1.parent.idMapping]) {
-                                            childRecords.splice(p, 1);
-                                            if (!childRecords.length) {
-                                                parentData.hasChildRecords = false;
-                                                this_1.updateParentRow(key, parentData, action);
-                                            }
-                                            break;
-                                        }
-                                    }
-                                }
-                                return "break";
-                            }
-                        }
-                        else {
-                            if (action === 'edit') {
-                                for (j = 0; j < keys.length; j++) {
-                                    if (treeData[i].hasOwnProperty(keys[j])) {
-                                        treeData[i][keys[j]] = modifiedData[k][keys[j]];
-                                    }
-                                }
-                            }
-                            else if (action === 'add') {
-                                var index = void 0;
-                                if (this_1.parent.editSettings.newRowPosition === 'Child') {
-                                    if (this_1.isSelfReference) {
-                                        originalData[this_1.parent.parentIdMapping] = treeData[i][this_1.parent.idMapping];
-                                        treeData.splice(i + 1, 0, originalData);
-                                    }
-                                    else {
-                                        if (!treeData[i].hasOwnProperty(this_1.parent.childMapping)) {
-                                            treeData[i][this_1.parent.childMapping] = [];
-                                        }
-                                        treeData[i][this_1.parent.childMapping].push(originalData);
-                                        this_1.updateParentRow(key, treeData[i], action);
-                                    }
-                                }
-                                else if (this_1.parent.editSettings.newRowPosition === 'Below') {
-                                    treeData.splice(i + 1, 0, originalData);
-                                }
-                                else if (!this_1.addRowIndex) {
-                                    index = 0;
-                                    treeData.splice(index, 0, originalData);
-                                }
-                                else if (this_1.parent.editSettings.newRowPosition === 'Above') {
-                                    treeData.splice(i, 0, originalData);
-                                }
-                            }
-                            return "break";
-                        }
-                    }
-                    else if (!isNullOrUndefined(treeData[i][this_1.parent.childMapping])) {
-                        if (this_1.removeChildRecords(treeData[i][this_1.parent.childMapping], modifiedData[k], action, key, originalData)) {
-                            this_1.updateParentRow(key, treeData[i], action);
-                        }
-                    }
-                };
-                var this_1 = this;
-                while (i-- && i >= 0) {
-                    var state_1 = _loop_1();
-                    if (state_1 === "break")
-                        break;
-                }
-            }
-        }
-    };
-    Edit.prototype.removeChildRecords = function (childRecords, modifiedData, action, key, originalData) {
-        var isChildAll = false;
-        var j = childRecords.length;
-        while (j-- && j >= 0) {
-            if (childRecords[j][key] === modifiedData[key] ||
-                (this.isSelfReference && childRecords[j][this.parent.parentIdMapping] === modifiedData[this.parent.idMapping])) {
-                if (action === 'edit') {
-                    var keys = Object.keys(modifiedData);
-                    for (var i = 0; i < keys.length; i++) {
-                        if (childRecords[j].hasOwnProperty(keys[i])) {
-                            childRecords[j][keys[i]] = modifiedData[keys[i]];
-                        }
-                    }
-                    break;
-                }
-                else if (action === 'add') {
-                    if (this.parent.editSettings.newRowPosition === 'Child') {
-                        if (this.isSelfReference) {
-                            originalData[this.parent.parentIdMapping] = childRecords[j][this.parent.idMapping];
-                            childRecords.splice(j + 1, 0, originalData);
-                            this.updateParentRow(key, childRecords[j], action);
-                        }
-                        else {
-                            if (!childRecords[j].hasOwnProperty(this.parent.childMapping)) {
-                                childRecords[j][this.parent.childMapping] = [];
-                            }
-                            childRecords[j][this.parent.childMapping].push(originalData);
-                            this.updateParentRow(key, childRecords[j], action);
-                        }
-                    }
-                    else if (this.parent.editSettings.newRowPosition === 'Above') {
-                        childRecords.splice(j, 0, originalData);
-                    }
-                    else if (this.parent.editSettings.newRowPosition === 'Below') {
-                        childRecords.splice(j + 1, 0, originalData);
-                    }
-                }
-                else {
-                    var parentItem = childRecords[j].parentItem;
-                    childRecords.splice(j, 1);
-                    if (!childRecords.length) {
-                        isChildAll = true;
-                    }
-                }
-            }
-            else if (!isNullOrUndefined(childRecords[j][this.parent.childMapping])) {
-                if (this.removeChildRecords(childRecords[j][this.parent.childMapping], modifiedData, action, key, originalData)) {
-                    this.updateParentRow(key, childRecords[j], action);
-                }
-            }
-        }
-        return isChildAll;
-    };
-    Edit.prototype.updateParentRow = function (key, record, action, child) {
-        var currentRecords = this.parent.grid.getCurrentViewRecords();
-        var index;
-        currentRecords.map(function (e, i) { if (e[key] === record[key]) {
-            index = i;
-            return;
-        } });
-        record = currentRecords[index];
-        record.hasChildRecords = false;
-        if (action === 'add') {
-            record.expanded = true;
-            record.hasChildRecords = true;
-            var childRecords = child ? child : currentRecords[index + 1];
-            if (!record.hasOwnProperty('childRecords')) {
-                record.childRecords = [];
-            }
-            if (record.childRecords.indexOf(childRecords) === -1) {
-                record.childRecords.unshift(childRecords);
-            }
-            if (this.isSelfReference) {
-                if (!record.hasOwnProperty(this.parent.childMapping)) {
-                    record[this.parent.childMapping] = [];
-                }
-                if (record.childRecords.indexOf(childRecords) === -1) {
-                    record[this.parent.childMapping].unshift(childRecords);
-                }
-            }
-        }
-        this.parent.grid.setRowData(key, record);
-        var row = this.parent.getRowByIndex(index);
-        this.parent.renderModule.cellRender({ data: record, cell: row.cells[this.parent.treeColumnIndex],
-            column: this.parent.grid.getColumns()[this.parent.treeColumnIndex] });
-    };
     /**
@@ -613,0 +424,0 @@ * Checks the status of validation at the time of editing. If validation is passed, it returns true.

src/treegrid/actions/filter.js

 import { getObject, Filter as GridFilter, Grid } from '@syncfusion/ej2-grids';
 import { isNullOrUndefined, setValue } from '@syncfusion/ej2-base';
+import { getParentData } from '../utils';
 /**
@@ -57,2 +58,3 @@ * TreeGrid Filter module will handle filtering action
     Filter.prototype.updatedFilteredRecord = function (dataDetails) {
+        setValue('uniqueIDFilterCollection', {}, this.parent);
         this.flatFilteredData = dataDetails.data;
@@ -62,25 +64,21 @@ this.filteredParentRecs = [];
         this.isHierarchyFilter = false;
-        var _loop_1 = function (f) {
-            var rec = this_1.flatFilteredData[f];
-            this_1.addParentRecord(rec);
-            if (this_1.parent.filterSettings.hierarchyMode === 'Child' ||
-                this_1.parent.filterSettings.hierarchyMode === 'None' || this_1.parent.searchSettings.hierarchyMode === 'Child' ||
-                this_1.parent.searchSettings.hierarchyMode === 'None') {
-                this_1.isHierarchyFilter = true;
+        for (var f = 0; f < this.flatFilteredData.length; f++) {
+            var rec = this.flatFilteredData[f];
+            this.addParentRecord(rec);
+            if (this.parent.filterSettings.hierarchyMode === 'Child' ||
+                this.parent.filterSettings.hierarchyMode === 'None' || this.parent.searchSettings.hierarchyMode === 'Child' ||
+                this.parent.searchSettings.hierarchyMode === 'None') {
+                this.isHierarchyFilter = true;
             }
             var ischild = getObject('childRecords', rec);
             if (!isNullOrUndefined(ischild) && ischild.length) {
-                setValue('hasFilteredChildRecords', this_1.checkChildExsist(rec), rec);
+                setValue('hasFilteredChildRecords', this.checkChildExsist(rec), rec);
             }
             var parent_1 = getObject('parentItem', rec);
             if (!isNullOrUndefined(parent_1)) {
-                var parRecord = this_1.flatFilteredData.filter(function (e) {
-                    return e.uniqueID === rec.parentItem.uniqueID;
-                })[0];
+                var parRecord = getParentData(this.parent, rec.parentItem.uniqueID, true);
+                //let parRecord: Object = this.flatFilteredData.filter((e: ITreeData) => {
+                //          return e.uniqueID === rec.parentItem.uniqueID; })[0];
                 setValue('hasFilteredChildRecords', true, parRecord);
             }
-        };
-        var this_1 = this;
-        for (var f = 0; f < this.flatFilteredData.length; f++) {
-            _loop_1(f);
         }
@@ -93,3 +91,4 @@ if (this.flatFilteredData.length > 0 && this.isHierarchyFilter) {
     Filter.prototype.addParentRecord = function (record) {
-        var parent = this.parent.flatData.filter(function (e) { return e.uniqueID === record.parentUniqueID; })[0];
+        var parent = getParentData(this.parent, record.parentUniqueID);
+        //let parent: Object = this.parent.flatData.filter((e: ITreeData) => {return e.uniqueID === record.parentUniqueID; })[0];
         if (this.parent.filterSettings.hierarchyMode === 'None' || this.parent.searchSettings.hierarchyMode === 'None') {
@@ -100,2 +99,3 @@ if (isNullOrUndefined(parent)) {
                         this.filteredResult.push(record);
+                        setValue('uniqueIDFilterCollection.' + record.uniqueID, record, this.parent);
                         record.hasFilteredChildRecords = true;
@@ -111,2 +111,3 @@ }
                         this.filteredResult.push(record);
+                        setValue('uniqueIDFilterCollection.' + record.uniqueID, record, this.parent);
                     }
@@ -117,2 +118,3 @@ }
                         this.filteredResult.push(record);
+                        setValue('uniqueIDFilterCollection.' + record.uniqueID, record, this.parent);
                     }
@@ -136,2 +138,3 @@ }
                 this.filteredResult.push(record);
+                setValue('uniqueIDFilterCollection.' + record.uniqueID, record, this.parent);
             }
@@ -144,6 +147,7 @@ }
         for (var count = 0; count < childRec.length; count++) {
-            var ischild = getObject('childRecords', childRec[count]);
+            var ischild = childRec[count].childRecords;
             if ((this.parent.filterSettings.hierarchyMode === 'Child' || this.parent.filterSettings.hierarchyMode === 'Both') ||
                 (this.parent.searchSettings.hierarchyMode === 'Child' || this.parent.searchSettings.hierarchyMode === 'Both')) {
                 this.filteredResult.push(childRec[count]);
+                setValue('uniqueIDFilterCollection.' + childRec[count].uniqueID, childRec[count], this.parent);
                 isExist = true;
@@ -166,17 +170,13 @@ }
         var len = this.filteredResult.length;
-        var _loop_2 = function (c) {
-            var parent_2 = this_2.parent.flatData.filter(function (e) { return e.uniqueID === record[c].parentUniqueID; })[0];
+        for (var c = 0; c < len; c++) {
+            var parent_2 = getParentData(this.parent, record[c].parentUniqueID);
             var isPrst = record.indexOf(parent_2) !== -1;
             if (isPrst) {
-                var parent_3 = this_2.filteredResult.filter(function (e) { return e.uniqueID === record[c].parentUniqueID; })[0];
-                setValue('filterLevel', parent_3.filterLevel + 1, record[c]);
+                var parent_3 = getParentData(this.parent, record[c].parentUniqueID, true);
+                record[c].filterLevel = parent_3.filterLevel + 1;
             }
             else {
-                setValue('filterLevel', 0, record[c]);
-                this_2.filteredParentRecs.push(record[c]);
+                record[c].filterLevel = 0;
+                this.filteredParentRecs.push(record[c]);
             }
-        };
-        var this_2 = this;
-        for (var c = 0; c < len; c++) {
-            _loop_2(c);
         }
@@ -191,11 +191,9 @@ };
             currentRecord = flatData[count];
-            var fLevel = getObject('filterLevel', currentRecord);
-            if (fLevel || fLevel === 0) {
-                var ischild = getObject('childRecords', currentRecord);
-                if (!isNullOrUndefined(ischild) && ischild.length) {
-                    setValue('hasFilteredChildRecords', true, currentRecord);
-                }
-                setValue('filterLevel', null, currentRecord);
+            var fLevel = currentRecord.filterLevel;
+            if (fLevel || fLevel === 0 || !isNullOrUndefined(currentRecord.hasFilteredChildRecords)) {
+                currentRecord.hasFilteredChildRecords = null;
+                currentRecord.filterLevel = null;
             }
         }
+        this.filteredResult = [];
         this.parent.notify('updateResults', { result: flatData, count: flatData.length });
@@ -202,0 +200,0 @@ };

src/treegrid/actions/index.d.ts

@@ -17,1 +17,2 @@ /**
 export * from './command-column';
+export * from './selection';

src/treegrid/actions/index.js

@@ -17,1 +17,2 @@ /**
 export * from './command-column';
+export * from './selection';

src/treegrid/actions/sort.d.ts

@@ -27,5 +27,4 @@ import { TreeGrid } from '../base/treegrid';
     removeEventListener(): void;
-    private createSorting;
-    private createSortRecords;
     private createdSortedRecords;
+    private iterateSort;
     /**
@@ -32,0 +31,0 @@ * Sorts a column with the given options.

src/treegrid/actions/sort.js

@@ -1,4 +0,5 @@
-import { isNullOrUndefined, extend } from '@syncfusion/ej2-base';
+import { isNullOrUndefined } from '@syncfusion/ej2-base';
 import { DataManager } from '@syncfusion/ej2-data';
-import { Sort as GridSort, Grid, getObject, getUid } from '@syncfusion/ej2-grids';
+import { Sort as GridSort, Grid } from '@syncfusion/ej2-grids';
+import { getParentData } from '../utils';
 /**
@@ -31,3 +32,2 @@ * Internal dataoperations for TreeGrid
         this.parent.on('createSort', this.createdSortedRecords, this);
-        this.parent.on('createSortRecords', this.createSorting, this);
     };
@@ -43,69 +43,29 @@ /**
         this.parent.off('createSort', this.createdSortedRecords);
-        this.parent.off('createSortRecords', this.createSorting);
     };
-    Sort.prototype.createSorting = function (data) {
+    Sort.prototype.createdSortedRecords = function (sortParams) {
+        var data = sortParams.modifiedData;
+        var srtQry = sortParams.srtQry;
+        this.iterateSort(data, srtQry);
+        this.storedIndex = -1;
+        this.parent.notify('updateAction', { result: this.flatSortedData });
         this.flatSortedData = [];
-        this.createSortRecords(data);
     };
-    Sort.prototype.createSortRecords = function (data) {
-        var sortData = getObject('modifiedData', data);
-        var parentRecords = getObject('parentRecords', data);
-        var filteredResult = getObject('filteredResult', data);
-        var dataLength = Object.keys(sortData).length;
-        for (var i = 0, len = dataLength; i < len; i++) {
-            var currentSortData = sortData[i];
-            this.storedIndex++;
-            var level = 0;
-            currentSortData.index = this.storedIndex;
-            if (!isNullOrUndefined(currentSortData[this.parent.childMapping])) {
-                currentSortData.childRecords =
-                    currentSortData[this.parent.childMapping];
-                currentSortData.hasChildRecords = true;
-                currentSortData.expanded = true;
+    Sort.prototype.iterateSort = function (data, srtQry) {
+        for (var d = 0; d < data.length; d++) {
+            if (this.parent.grid.filterSettings.columns.length > 0) {
+                if (!isNullOrUndefined(getParentData(this.parent, data[d].uniqueID, true))) {
+                    this.storedIndex++;
+                    this.flatSortedData[this.storedIndex] = data[d];
+                }
             }
-            if (isNullOrUndefined(currentSortData.uniqueID)) {
-                currentSortData.uniqueID = getUid(this.parent.element.id + '_data_');
+            else {
+                this.storedIndex++;
+                this.flatSortedData[this.storedIndex] = data[d];
             }
-            if (!isNullOrUndefined(parentRecords)) {
-                var parentData = extend({}, parentRecords);
-                delete parentData.childRecords;
-                delete parentData[this.parent.childMapping];
-                currentSortData.parentItem = parentData;
-                currentSortData.parentUniqueID = parentData.uniqueID;
-                level = parentRecords.level + 1;
+            if (data[d].hasChildRecords) {
+                var childSort = (new DataManager(data[d].childRecords).executeLocal(srtQry));
+                this.iterateSort(childSort, srtQry);
             }
-            currentSortData.level = level;
-            if (isNullOrUndefined(currentSortData[this.parent.parentIdMapping]) ||
-                currentSortData.parentItem) {
-                this.flatSortedData.push(currentSortData);
-            }
-            if (!isNullOrUndefined(currentSortData[this.parent.childMapping])) {
-                this.createSortRecords({ modifiedData: currentSortData[this.parent.childMapping], parentRecords: currentSortData,
-                    filteredResult: filteredResult });
-            }
         }
-        this.parent.notify('Sorting', { sortedData: this.flatSortedData, filteredData: filteredResult });
     };
-    Sort.prototype.createdSortedRecords = function (sortingElements) {
-        var data = getObject('modifiedData', sortingElements);
-        var sortQuery = getObject('srtQry', sortingElements);
-        var parent = getObject('parent', sortingElements);
-        for (var i = 0, len = Object.keys(data).length; i < len; i++) {
-            if (!isNullOrUndefined(data[i].childRecords) || !isNullOrUndefined(data[i][parent.childMapping])) {
-                var sortedData = void 0;
-                var sortchildData = void 0;
-                if (isNullOrUndefined(data[i].childRecords)) {
-                    sortedData = new DataManager(data[i][parent.childMapping]).executeLocal(sortQuery);
-                }
-                else {
-                    sortedData = new DataManager(data[i].childRecords).executeLocal(sortQuery);
-                }
-                sortchildData = sortedData;
-                if (sortchildData.length > 0) {
-                    data[i][parent.childMapping] = sortchildData;
-                }
-                this.createdSortedRecords({ modifiedData: sortchildData, parent: parent, srtQry: sortQuery });
-            }
-        }
-    };
     /**
@@ -112,0 +72,0 @@ * Sorts a column with the given options.

src/treegrid/actions/toolbar.js

@@ -44,3 +44,3 @@ import { Grid, Toolbar as tool } from '@syncfusion/ej2-grids';
         }
-        else if (args.item.id === this.parent.grid.element.id + '_collapseall') {
+        if (args.item.id === this.parent.grid.element.id + '_collapseall') {
             this.parent.collapseAll();
@@ -47,0 +47,0 @@ }

src/treegrid/base/constant.d.ts

@@ -18,4 +18,8 @@ /**
 /** @hidden */
+export declare const rowSelecting: string;
+/** @hidden */
 export declare const rowSelected: string;
 /** @hidden */
+export declare const checkboxChange: string;
+/** @hidden */
 export declare const rowDeselected: string;
@@ -49,2 +53,6 @@ /** @hidden */
 /** @hidden */
+export declare const contextMenuClick: string;
+/** @hidden */
+export declare const savePreviousRowPosition: string;
+/** @hidden */
 export declare const crudAction: string;
@@ -51,0 +59,0 @@ /** @hidden */

src/treegrid/base/constant.js

@@ -18,4 +18,8 @@ /**
 /** @hidden */
+export var rowSelecting = 'rowSelecting';
+/** @hidden */
 export var rowSelected = 'rowSelected';
 /** @hidden */
+export var checkboxChange = 'checkboxChange';
+/** @hidden */
 export var rowDeselected = 'rowDeselected';
@@ -49,2 +53,6 @@ /** @hidden */
 /** @hidden */
+export var contextMenuClick = 'contextMenuClick';
+/** @hidden */
+export var savePreviousRowPosition = 'savePreviousRowPosition';
+/** @hidden */
 export var crudAction = 'crudAction';
@@ -51,0 +59,0 @@ /** @hidden */

src/treegrid/base/data.d.ts

@@ -40,3 +40,3 @@ import { TreeGrid } from './treegrid';
     convertToFlatData(data: Object): void;
-    private updateChildHierarchy;
+    private selfReferenceUpdate;
     /**
@@ -54,3 +54,2 @@ * Function to update the zeroth level parent records in remote binding
     private createRecords;
-    private sortedRecords;
     /**
@@ -57,0 +56,0 @@ * Function to perform filtering/sorting action for local data

src/treegrid/base/data.js

 import { extend, isNullOrUndefined, setValue, getValue } from '@syncfusion/ej2-base';
 import { DataManager, Query, DataUtil } from '@syncfusion/ej2-data';
 import { showSpinner, hideSpinner } from '@syncfusion/ej2-popups';
-import { getObject, iterateExtend, getUid } from '@syncfusion/ej2-grids';
+import { getObject, getUid } from '@syncfusion/ej2-grids';
 import { isRemoteData, isOffline } from '../utils';
@@ -29,3 +29,2 @@ import * as events from './constant';
     DataManipulation.prototype.addEventListener = function () {
-        this.parent.on('Sorting', this.sortedRecords, this);
         this.parent.on('updateRemoteLevel', this.updateParentRemoteData, this);
@@ -48,3 +47,2 @@ this.parent.grid.on('sorting-begin', this.beginSorting, this);
         this.parent.off('dataProcessor', this.dataProcessor);
-        this.parent.off('Sorting', this.sortedRecords);
         this.parent.grid.off('sorting-begin', this.beginSorting);
@@ -75,2 +73,3 @@ };
         var _this = this;
+        this.parent.flatData = [];
         if ((isRemoteData(this.parent) && !isOffline(this.parent)) && data instanceof DataManager) {
@@ -94,3 +93,3 @@ var dm = this.parent.dataSource;
                         if (req === 0) {
-                            setValue('grid.contentModule.isLoaded', true, _this).parent;
+                            setValue('grid.contentModule.isLoaded', true, _this.parent);
                             if (!isNullOrUndefined(_this.zerothLevelData)) {
@@ -117,28 +116,27 @@ setValue('cancel', false, _this.zerothLevelData);
             }
-            var mappingData = new DataManager(data).executeLocal(new Query()
-                .where(this.parent.parentIdMapping, 'notequal', null)
-                .group(this.parent.parentIdMapping));
-            //let selfData: Object[] = [];
-            for (var i = 0; i < mappingData.length; i++) {
-                var groupData = mappingData[i];
-                var index = this.taskIds.indexOf(groupData.key);
-                if (index > -1) {
+            if (this.isSelfReference) {
+                var selfData = [];
+                var mappingData = new DataManager(this.hierarchyData).executeLocal(new Query()
+                    .where(this.parent.parentIdMapping, 'notequal', null)
+                    .group(this.parent.parentIdMapping));
+                for (var i = 0; i < mappingData.length; i++) {
+                    var groupData = mappingData[i];
+                    var index = this.taskIds.indexOf(groupData.key);
                     if (!isNullOrUndefined(groupData.key)) {
-                        var childData = iterateExtend(groupData.items);
-                        if (this.isSelfReference) {
-                            if (!this.updateChildHierarchy(this.hierarchyData, this.hierarchyData[index], childData, index)) {
-                                this.hierarchyData[index][this.parent.childMapping] = childData;
-                                if (!isNullOrUndefined(this.hierarchyData[index][this.parent.parentIdMapping]) && groupData.key === this.taskIds[index]) {
-                                    this.hierarchyData.splice(index, 1);
-                                    this.taskIds.splice(index, 1);
-                                }
-                            }
-                        }
-                        else {
+                        if (index > -1) {
+                            var childData = (groupData.items);
                             this.hierarchyData[index][this.parent.childMapping] = childData;
+                            continue;
                         }
                     }
+                    selfData.push.apply(selfData, groupData.items);
                 }
+                this.hierarchyData = this.selfReferenceUpdate(selfData);
             }
-            this.createRecords(this.hierarchyData);
+            if (!Object.keys(this.hierarchyData).length) {
+                this.parent.flatData = [];
+            }
+            else {
+                this.createRecords(this.hierarchyData);
+            }
             this.storedIndex = -1;
@@ -161,23 +159,15 @@ }
     // }
-    DataManipulation.prototype.updateChildHierarchy = function (data, currentData, childData, index) {
-        var parentID = currentData[this.parent.parentIdMapping];
-        var returns = false;
-        var id = currentData[this.parent.idMapping];
-        for (var i = 0; i < data.length; i++) {
-            if (data[i][this.parent.idMapping] === parentID) {
-                var childs = data[i][this.parent.childMapping];
-                for (var j = 0; j < childs.length; j++) {
-                    if (childs[j][this.parent.idMapping] === id) {
-                        childs[j][this.parent.childMapping] = childData;
-                        this.hierarchyData.splice(index, 1);
-                        this.taskIds.splice(index, 1);
-                        return true;
-                    }
-                }
+    DataManipulation.prototype.selfReferenceUpdate = function (selfData) {
+        var result = [];
+        while (this.hierarchyData.length > 0 && selfData.length > 0) {
+            var index = selfData.indexOf(this.hierarchyData[0]);
+            if (index === -1) {
+                this.hierarchyData.shift();
             }
-            else if (!isNullOrUndefined(data[i][this.parent.childMapping])) {
-                returns = this.updateChildHierarchy(data[i][this.parent.childMapping], currentData, childData, index);
+            else {
+                result.push(this.hierarchyData.shift());
+                selfData.splice(index, 1);
             }
         }
-        return returns;
+        return result;
     };
@@ -270,6 +260,7 @@ /**
             currentData.index = currentData.hasChildRecords ? this.storedIndex : this.storedIndex;
-            if (isNullOrUndefined(currentData[this.parent.parentIdMapping])) {
+            if (this.isSelfReference && isNullOrUndefined(currentData[this.parent.parentIdMapping])) {
                 this.parent.parentData.push(currentData);
             }
             currentData.uniqueID = getUid(this.parent.element.id + '_data_');
+            setValue('uniqueIDCollection.' + currentData.uniqueID, currentData, this.parent);
             if (!isNullOrUndefined(parentRecords)) {
@@ -284,35 +275,14 @@ var parentData = extend({}, parentRecords);
             currentData.level = level;
+            currentData.checkboxState = 'uncheck';
             if (isNullOrUndefined(currentData[this.parent.parentIdMapping]) || currentData.parentItem) {
                 this.parent.flatData.push(currentData);
             }
-            if (!isNullOrUndefined(currentData[this.parent.childMapping])) {
+            if (!this.isSelfReference && currentData.level === 0) {
+                this.parent.parentData.push(currentData);
+            }
+            if (!isNullOrUndefined(currentData[this.parent.childMapping] && currentData[this.parent.childMapping].length)) {
                 this.createRecords(currentData[this.parent.childMapping], currentData);
             }
         }
-        if (!Object.keys(data).length) {
-            this.parent.flatData = [];
-        }
     };
-    DataManipulation.prototype.sortedRecords = function (data) {
-        var sortedData = getObject('sortedData', data);
-        this.sortedData = [];
-        if (this.parent.grid.filterSettings.columns.length > 0) {
-            var sortedData_1 = getObject('sortedData', data);
-            var filteredData = getObject('filteredData', data);
-            for (var i = 0, len = Object.keys(sortedData_1).length; i < len; i++) {
-                for (var j = 0, sortlen = Object.keys(filteredData).length; j < sortlen; j++) {
-                    var sortData = getObject('uniqueID', sortedData_1[i]);
-                    var filterData = getObject('uniqueID', filteredData[j]);
-                    if (sortData === filterData) {
-                        this.sortedData.push(sortedData_1[i]);
-                    }
-                }
-            }
-        }
-        else {
-            for (var i = 0, len = Object.keys(sortedData).length; i < len; i++) {
-                this.sortedData.push(sortedData[i]);
-            }
-        }
-    };
     /**
@@ -323,4 +293,5 @@ * Function to perform filtering/sorting action for local data
     DataManipulation.prototype.dataProcessor = function (args) {
-        var results = this.parent.flatData;
-        var count = this.parent.flatData.length;
+        var dataObj = this.parent.grid.dataSource;
+        var results = dataObj instanceof DataManager ? dataObj.dataSource.json : dataObj;
+        var count = results.length;
         if ((this.parent.grid.allowFiltering && this.parent.grid.filterSettings.columns.length) ||
@@ -338,3 +309,3 @@ (this.parent.grid.searchSettings.key.length > 0)) {
             qry.queries = fltrQuery.concat(srchQuery);
-            var filteredData = new DataManager(this.parent.flatData).executeLocal(qry);
+            var filteredData = new DataManager(results).executeLocal(qry);
             this.parent.notify('updateFilterRecs', { data: filteredData });
@@ -367,34 +338,25 @@ results = this.dataResults.result;
             var collpasedIndexes = [];
-            if (args[action] !== 'collapse' && args[action] !== 'expand') {
-                if (!this.isSelfReference && this.parent.childMapping.length > 0) {
-                    parentData = iterateExtend(this.parent.dataSource);
-                }
-                else {
-                    parentData = iterateExtend(this.parent.parentData);
-                }
-                var sortedData = void 0;
-                var query = getObject('query', args);
-                this.parent.sortModule = new Sort(this.parent);
-                var srtQry = new Query();
-                for (var srt = this.parent.grid.sortSettings.columns.length - 1; srt >= 0; srt--) {
-                    var col = this.parent.getColumnByField(this.parent.grid.sortSettings.columns[srt].field);
-                    var compFun = col.sortComparer && !this.isRemote() ?
-                        col.sortComparer.bind(col) :
-                        this.parent.grid.sortSettings.columns[srt].direction;
-                    srtQry.sortBy(this.parent.grid.sortSettings.columns[srt].field, compFun);
-                }
-                var modifiedData = new DataManager(parentData).executeLocal(srtQry);
-                sortedData = modifiedData;
-                this.parent.notify('createSort', { modifiedData: modifiedData, parent: this.parent, srtQry: srtQry });
-                this.parent.notify('createSortRecords', {
-                    modifiedData: modifiedData,
-                    parentRecords: null, filteredResult: results
-                });
+            parentData = this.parent.parentData;
+            var sortedData = void 0;
+            var query = getObject('query', args);
+            this.parent.sortModule = new Sort(this.parent);
+            var srtQry = new Query();
+            for (var srt = this.parent.grid.sortSettings.columns.length - 1; srt >= 0; srt--) {
+                var col = this.parent.getColumnByField(this.parent.grid.sortSettings.columns[srt].field);
+                var compFun = col.sortComparer && !this.isRemote() ?
+                    col.sortComparer.bind(col) :
+                    this.parent.grid.sortSettings.columns[srt].direction;
+                srtQry.sortBy(this.parent.grid.sortSettings.columns[srt].field, compFun);
             }
-            results = this.sortedData;
+            var modifiedData = new DataManager(parentData).executeLocal(srtQry);
+            sortedData = modifiedData;
+            this.parent.notify('createSort', { modifiedData: modifiedData, filteredData: results, srtQry: srtQry });
+            results = this.dataResults.result;
+            this.dataResults.result = null;
+            this.sortedData = results;
             this.parent.notify('updateModel', {});
             if (this.parent.grid.aggregates.length > 0) {
                 var isSort = false;
-                var query = getObject('query', args);
-                var summaryQuery = query.queries.filter(function (q) { return q.fn === 'onAggregates'; });
+                var query_1 = getObject('query', args);
+                var summaryQuery = query_1.queries.filter(function (q) { return q.fn === 'onAggregates'; });
                 results = this.parent.summaryModule.calculateSummaryValue(summaryQuery, this.sortedData, isSort);
@@ -409,9 +371,2 @@ }
         }
-        /*if (isNullOrUndefined(this.dataResults.result)) {
-          args.result = <ITreeData[]>results;
-          args.count = count;
-        } else {
-          args.result = <ITreeData[]>this.dataResults.result;
-          args.count = this.dataResults.count;
-        }*/
         args.result = results;
@@ -418,0 +373,0 @@ args.count = count;

src/treegrid/base/interface.d.ts

@@ -51,2 +51,10 @@ import { Column } from '../models/column';
     parentUniqueID?: string;
+    /**
+     * Specifies the checkbox state of a record
+     */
+    checkboxState?: string;
+    /**
+     * Specifies the summary of a record
+     */
+    isSummaryRow?: boolean;
 }
@@ -53,0 +61,0 @@ export interface ITreeGridCellFormatter {

src/treegrid/base/treegrid-model.d.ts

@@ -1,2 +0,2 @@
-import { Component, addClass, createElement, EventHandler, isNullOrUndefined, Ajax, ModuleDeclaration, extend} from '@syncfusion/ej2-base';import { removeClass, EmitType, Complex, Collection, KeyboardEventArgs } from '@syncfusion/ej2-base';import {Event, Property, NotifyPropertyChanges, INotifyPropertyChanged, setValue, KeyboardEvents, L10n } from '@syncfusion/ej2-base';import { Column, ColumnModel } from '../models/column';import { GridModel, ColumnQueryModeType, HeaderCellInfoEventArgs, EditSettingsModel as GridEditModel}  from '@syncfusion/ej2-grids';import { SearchEventArgs, AddEventArgs, EditEventArgs, DeleteEventArgs}  from '@syncfusion/ej2-grids';import { SaveEventArgs, CellSaveArgs, BatchAddArgs, BatchCancelArgs,  BeginEditArgs, CellEditArgs}  from '@syncfusion/ej2-grids';import { FilterSettings } from '../models/filter-settings';import {Filter} from '../actions/filter';import {Aggregate} from '../actions/summary';import { Reorder } from '../actions/reorder';import { Resize } from '../actions/resize';import { ColumnMenu } from '../actions/column-menu';import { Print } from '../actions/print';import * as events from '../base/constant';import { FilterSettingsModel } from '../models/filter-settings-model';import { SearchSettings} from '../models/search-settings';import { SearchSettingsModel } from '../models/search-settings-model';import {RowInfo, RowDataBoundEventArgs, PageEventArgs, FilterEventArgs, FailureEventArgs, SortEventArgs } from '@syncfusion/ej2-grids';import { RowSelectingEventArgs, RowSelectEventArgs, RowDeselectEventArgs, IIndex, ISelectedCell } from '@syncfusion/ej2-grids';import {ColumnModel as GridColumnModel, Column as GridColumn, CellSelectEventArgs, CellDeselectEventArgs } from '@syncfusion/ej2-grids';import { SelectionSettings } from '../models/selection-settings';import { SelectionSettingsModel } from '../models/selection-settings-model';import {getActualProperties, SortDirection, getObject, ColumnDragEventArgs } from '@syncfusion/ej2-grids';import { TextWrapSettings, TextWrapSettingsModel, PrintMode, Data, IGrid, ContextMenuItemModel } from '@syncfusion/ej2-grids';import { ExcelExportCompleteArgs, ExcelHeaderQueryCellInfoEventArgs, ExcelQueryCellInfoEventArgs } from '@syncfusion/ej2-grids';import { PdfExportCompleteArgs, PdfHeaderQueryCellInfoEventArgs, PdfQueryCellInfoEventArgs } from '@syncfusion/ej2-grids';import { ExcelExportProperties, PdfExportProperties, CellSelectingEventArgs, PrintEventArgs } from '@syncfusion/ej2-grids';import {BeforeDataBoundArgs} from '@syncfusion/ej2-grids';import { DataManager, ReturnOption, RemoteSaveAdaptor, Query } from '@syncfusion/ej2-data';import { createSpinner, hideSpinner, showSpinner } from '@syncfusion/ej2-popups';import { isRemoteData, isOffline } from '../utils';import { Grid, QueryCellInfoEventArgs } from '@syncfusion/ej2-grids';import { Render } from '../renderer/render';import { DataManipulation } from './data';import { Sort } from '../actions/sort';import { ITreeData, RowExpandedEventArgs, RowExpandingEventArgs, RowCollapsedEventArgs, RowCollapsingEventArgs } from './interface';import { CellSaveEventArgs } from './interface';import { iterateArrayOrObject, GridLine } from '@syncfusion/ej2-grids';import { DataSourceChangedEventArgs, DataStateChangeEventArgs, RecordDoubleClickEventArgs, ResizeArgs } from '@syncfusion/ej2-grids';import { ToolbarItems, ToolbarItem, ContextMenuItem, ContextMenuItems } from '../enum';import { ItemModel, ClickEventArgs, BeforeOpenCloseMenuEventArgs, MenuEventArgs } from '@syncfusion/ej2-navigations';import { PageSettings } from '../models/page-settings';import { PageSettingsModel } from '../models/page-settings-model';import { AggregateRow } from '../models/summary';import { AggregateRowModel } from '../models/summary-model';import { ExcelExport } from '../actions/excel-export';import { PdfExport } from '../actions/pdf-export';import { Toolbar } from '../actions/toolbar';import { Page } from '../actions/page';import { ContextMenu } from '../actions/context-menu';import { EditSettings } from '../models/edit-settings';import { EditSettingsModel } from '../models/edit-settings-model';import { Edit} from '../actions/edit';import { SortSettings } from '../models/sort-settings';import { SortSettingsModel } from '../models/sort-settings-model';
+import { Component, addClass, createElement, EventHandler, isNullOrUndefined, Ajax, ModuleDeclaration, extend} from '@syncfusion/ej2-base';import { removeClass, EmitType, Complex, Collection, KeyboardEventArgs } from '@syncfusion/ej2-base';import {Event, Property, NotifyPropertyChanges, INotifyPropertyChanged, setValue, KeyboardEvents, L10n } from '@syncfusion/ej2-base';import { Column, ColumnModel } from '../models/column';import { GridModel, ColumnQueryModeType, HeaderCellInfoEventArgs, EditSettingsModel as GridEditModel}  from '@syncfusion/ej2-grids';import { SearchEventArgs, AddEventArgs, EditEventArgs, DeleteEventArgs}  from '@syncfusion/ej2-grids';import { SaveEventArgs, CellSaveArgs, BatchAddArgs, BatchCancelArgs,  BeginEditArgs, CellEditArgs}  from '@syncfusion/ej2-grids';import { FilterSettings } from '../models/filter-settings';import {Filter} from '../actions/filter';import {Aggregate} from '../actions/summary';import { Reorder } from '../actions/reorder';import { Resize } from '../actions/resize';import { Selection as TreeGridSelection } from '../actions/selection';import { ColumnMenu } from '../actions/column-menu';import { Print } from '../actions/print';import * as events from '../base/constant';import { FilterSettingsModel } from '../models/filter-settings-model';import { SearchSettings} from '../models/search-settings';import { SearchSettingsModel } from '../models/search-settings-model';import {RowInfo, RowDataBoundEventArgs, PageEventArgs, FilterEventArgs, FailureEventArgs, SortEventArgs } from '@syncfusion/ej2-grids';import { RowSelectingEventArgs, RowSelectEventArgs, RowDeselectEventArgs, IIndex, ISelectedCell } from '@syncfusion/ej2-grids';import {ColumnModel as GridColumnModel, Column as GridColumn, CellSelectEventArgs, CellDeselectEventArgs } from '@syncfusion/ej2-grids';import { SelectionSettings } from '../models/selection-settings';import { SelectionSettingsModel } from '../models/selection-settings-model';import {getActualProperties, SortDirection, getObject, ColumnDragEventArgs } from '@syncfusion/ej2-grids';import { TextWrapSettings, TextWrapSettingsModel, PrintMode, Data, IGrid, ContextMenuItemModel } from '@syncfusion/ej2-grids';import { ColumnMenuItem, ColumnMenuItemModel, CheckBoxChangeEventArgs } from '@syncfusion/ej2-grids';import { ExcelExportCompleteArgs, ExcelHeaderQueryCellInfoEventArgs, ExcelQueryCellInfoEventArgs } from '@syncfusion/ej2-grids';import { PdfExportCompleteArgs, PdfHeaderQueryCellInfoEventArgs, PdfQueryCellInfoEventArgs } from '@syncfusion/ej2-grids';import { ExcelExportProperties, PdfExportProperties, CellSelectingEventArgs, PrintEventArgs } from '@syncfusion/ej2-grids';import { ColumnMenuOpenEventArgs } from '@syncfusion/ej2-grids';import {BeforeDataBoundArgs} from '@syncfusion/ej2-grids';import { DataManager, ReturnOption, RemoteSaveAdaptor, Query } from '@syncfusion/ej2-data';import { createSpinner, hideSpinner, showSpinner } from '@syncfusion/ej2-popups';import { isRemoteData, isOffline } from '../utils';import { Grid, QueryCellInfoEventArgs } from '@syncfusion/ej2-grids';import { Render } from '../renderer/render';import { DataManipulation } from './data';import { Sort } from '../actions/sort';import { ITreeData, RowExpandedEventArgs, RowExpandingEventArgs, RowCollapsedEventArgs, RowCollapsingEventArgs } from './interface';import { CellSaveEventArgs } from './interface';import { iterateArrayOrObject, GridLine } from '@syncfusion/ej2-grids';import { DataSourceChangedEventArgs, DataStateChangeEventArgs, RecordDoubleClickEventArgs, ResizeArgs } from '@syncfusion/ej2-grids';import { ToolbarItems, ToolbarItem, ContextMenuItem, ContextMenuItems } from '../enum';import { ItemModel, ClickEventArgs, BeforeOpenCloseMenuEventArgs, MenuEventArgs } from '@syncfusion/ej2-navigations';import { PageSettings } from '../models/page-settings';import { PageSettingsModel } from '../models/page-settings-model';import { AggregateRow } from '../models/summary';import { AggregateRowModel } from '../models/summary-model';import { ExcelExport } from '../actions/excel-export';import { PdfExport } from '../actions/pdf-export';import { Toolbar } from '../actions/toolbar';import { Page } from '../actions/page';import { ContextMenu } from '../actions/context-menu';import { EditSettings } from '../models/edit-settings';import { EditSettingsModel } from '../models/edit-settings-model';import { Edit} from '../actions/edit';import { SortSettings } from '../models/sort-settings';import { SortSettingsModel } from '../models/sort-settings-model';
 import {ComponentModel} from '@syncfusion/ej2-base';
@@ -121,2 +121,8 @@
     /**
+ * If `autoCheckHierarchy` is set to true, hierarchy checkbox selection has been enabled in TreeGrid.      
+ * @default false    
+ */
+    autoCheckHierarchy?: boolean;
+
+    /**
    * Configures the pager in the TreeGrid.  
@@ -254,5 +260,18 @@ * @default {currentPage: 1, pageSize: 12, pageCount: 8, enableQueryString: false, pageSizes: false, template: null}
      */
-    contextMenuItems?: ContextMenuItem[] | ContextMenuItemModel[]  ;
+    contextMenuItems?: ContextMenuItem[] | ContextMenuItemModel[];
 
     /**
+     * `columnMenuItems` defines both built-in and custom column menu items.
+     * <br><br> 
+     * The available built-in items are,
+     * * `AutoFitAll` - Auto fit the size of all columns. 
+     * * `AutoFit` - Auto fit the current column.
+     * * `SortAscending` - Sort the current column in ascending order.
+     * * `SortDescending` - Sort the current column in descending order.
+     * * `Filter` - Filter options will show based on filterSettings property like filterbar, menu filter.
+     * @default null
+     */
+    columnMenuItems?: ColumnMenuItem[] | ColumnMenuItemModel[];
+
+    /**
    * Defines the height of TreeGrid rows.
@@ -285,3 +304,3 @@ * @default null
    * Defines the scrollable height of the TreeGrid content.    
-   * @default auto    
+   * @default 'auto'    
    */
@@ -292,3 +311,3 @@ height?: string | number;
    * Defines the TreeGrid width.    
-   * @default auto    
+   * @default 'auto'    
    */
@@ -456,2 +475,14 @@ width?: string | number;
     /**
+     * Triggers before column menu opens.
+     * @event
+     */
+    columnMenuOpen?: EmitType<ColumnMenuOpenEventArgs>;
+
+    /**
+     * Triggers when click on column menu.
+     * @event
+     */
+    columnMenuClick?: EmitType<MenuEventArgs>;
+
+    /**
      * Triggers after a cell is selected.
@@ -511,2 +542,8 @@ * @event
     /**
+   * Triggers when the check box state change in checkbox column.
+   * @event
+   */
+    checkboxChange?: EmitType<CheckBoxChangeEventArgs>;
+
+    /**
   * Triggers after print action is completed.  
@@ -513,0 +550,0 @@ * @event

src/treegrid/base/treegrid.d.ts

@@ -12,2 +12,3 @@ import { Component, ModuleDeclaration } from '@syncfusion/ej2-base';
 import { Resize } from '../actions/resize';
+import { Selection as TreeGridSelection } from '../actions/selection';
 import { ColumnMenu } from '../actions/column-menu';
@@ -24,5 +25,7 @@ import { Print } from '../actions/print';
 import { TextWrapSettingsModel, PrintMode, Data, ContextMenuItemModel } from '@syncfusion/ej2-grids';
+import { ColumnMenuItem, ColumnMenuItemModel, CheckBoxChangeEventArgs } from '@syncfusion/ej2-grids';
 import { ExcelExportCompleteArgs, ExcelHeaderQueryCellInfoEventArgs, ExcelQueryCellInfoEventArgs } from '@syncfusion/ej2-grids';
 import { PdfExportCompleteArgs, PdfHeaderQueryCellInfoEventArgs, PdfQueryCellInfoEventArgs } from '@syncfusion/ej2-grids';
 import { ExcelExportProperties, PdfExportProperties, CellSelectingEventArgs, PrintEventArgs } from '@syncfusion/ej2-grids';
+import { ColumnMenuOpenEventArgs } from '@syncfusion/ej2-grids';
 import { BeforeDataBoundArgs } from '@syncfusion/ej2-grids';
@@ -67,2 +70,4 @@ import { DataManager, Query } from '@syncfusion/ej2-data';
     private registeredTemplate;
+    private uniqueIDCollection;
+    private uniqueIDFilterCollection;
     /**
@@ -120,2 +125,3 @@ * The `sortModule` is used to manipulate sorting in TreeGrid.
     pdfExportModule: PdfExport;
+    selectionModule: TreeGridSelection;
     /** @hidden */
@@ -219,2 +225,7 @@ /** @hidden */
     /**
+     * If `autoCheckHierarchy` is set to true, hierarchy checkbox selection has been enabled in TreeGrid.
+     * @default false
+     */
+    autoCheckHierarchy: boolean;
+    /**
      * Configures the pager in the TreeGrid.
@@ -340,2 +351,14 @@ * @default {currentPage: 1, pageSize: 12, pageCount: 8, enableQueryString: false, pageSizes: false, template: null}
     /**
+     * `columnMenuItems` defines both built-in and custom column menu items.
+     * <br><br>
+     * The available built-in items are,
+     * * `AutoFitAll` - Auto fit the size of all columns.
+     * * `AutoFit` - Auto fit the current column.
+     * * `SortAscending` - Sort the current column in ascending order.
+     * * `SortDescending` - Sort the current column in descending order.
+     * * `Filter` - Filter options will show based on filterSettings property like filterbar, menu filter.
+     * @default null
+     */
+    columnMenuItems: ColumnMenuItem[] | ColumnMenuItemModel[];
+    /**
      * Defines the height of TreeGrid rows.
@@ -364,3 +387,3 @@ * @default null
      * Defines the scrollable height of the TreeGrid content.
-     * @default auto
+     * @default 'auto'
      */
@@ -370,3 +393,3 @@ height: string | number;
      * Defines the TreeGrid width.
-     * @default auto
+     * @default 'auto'
      */
@@ -507,2 +530,12 @@ width: string | number;
     /**
+     * Triggers before column menu opens.
+     * @event
+     */
+    columnMenuOpen: EmitType<ColumnMenuOpenEventArgs>;
+    /**
+     * Triggers when click on column menu.
+     * @event
+     */
+    columnMenuClick: EmitType<MenuEventArgs>;
+    /**
      * Triggers after a cell is selected.
@@ -553,2 +586,7 @@ * @event
     /**
+     * Triggers when the check box state change in checkbox column.
+     * @event
+     */
+    checkboxChange: EmitType<CheckBoxChangeEventArgs>;
+    /**
      * Triggers after print action is completed.
@@ -584,2 +622,6 @@ * @event
     /**
+     * Triggers when row elements are dragged (moved) continuously.
+     * @event
+     */
+    /**
      * The `selectedRowIndex` allows you to select a row at initial rendering.
@@ -1049,2 +1091,17 @@ * You can also get the currently selected row index.
     /**
+     * Get the records of checked rows.
+     * @return {Object[]}
+     * @hidden
+     */
+    getCheckedRecords(): Object[];
+    /**
+     * Get the indexes of checked rows.
+     * @return {number[]}
+     */
+    getCheckedRowIndexes(): number[];
+    /**
+     * Checked the checkboxes using rowIndexes.
+     */
+    selectCheckboxes(indexes: number[]): void;
+    /**
      * Refreshes the TreeGrid column changes.
@@ -1051,0 +1108,0 @@ */

src/treegrid/enum.d.ts

@@ -56,3 +56,5 @@ /**
     CsvExport = 10,
-    Print = 11
+    Print = 11,
+    RowIndent = 12,
+    RowOutdent = 13
 }
@@ -59,0 +61,0 @@ /**

src/treegrid/enum.js

@@ -19,2 +19,4 @@ /**
     ToolbarItem[ToolbarItem["Print"] = 11] = "Print";
+    ToolbarItem[ToolbarItem["RowIndent"] = 12] = "RowIndent";
+    ToolbarItem[ToolbarItem["RowOutdent"] = 13] = "RowOutdent";
 })(ToolbarItem || (ToolbarItem = {}));
@@ -21,0 +23,0 @@ /**

src/treegrid/models/column.d.ts

@@ -14,3 +14,3 @@ import { TextAlign, ClipMode, ValueAccessor, IFilter, IFilterUI, IEditCell, CommandModel } from '@syncfusion/ej2-grids';
      * the first character must be an alphabet and should not contain spaces and special characters.
-     * @default undefined
+     * @default 'undefined'
      */
@@ -21,3 +21,3 @@ field: string;
      * If `headerText` is not defined, then field name value will be assigned to header text.
-     * @default undefined
+     * @default 'undefined'
      */
@@ -27,3 +27,3 @@ headerText: string;
      * Gets the unique identifier value of the column. It is used to get the column object.
-     * @default undefined
+     * @default 'undefined'
      */
@@ -38,2 +38,7 @@ uid: string;
     /**
+     * If `showCheckbox` set to true, then the checkboxes will be displayed in particular column.
+     * @default false
+     */
+    showCheckbox: boolean;
+    /**
      * Defines the custom sort comparer function.
@@ -68,3 +73,3 @@ * The sort comparer function has the same functionality like
      * Defines the width of the column in pixels or percentage.
-     * @default undefined
+     * @default 'undefined'
      */
@@ -74,3 +79,3 @@ width: string | number;
      * Defines the type of component for editable.
-     * @default stringedit
+     * @default 'stringedit'
      */
@@ -107,3 +112,3 @@ editType: string;
      * Defines the minimum Width of the column in pixels or percentage.
-     * @default undefined
+     * @default 'undefined'
      */
@@ -113,3 +118,3 @@ minWidth: string | number;
      * Defines the maximum width of the column in pixel or percentage, which will restrict resizing beyond this pixel or percentage.
-     * @default undefined
+     * @default 'undefined'
      */
@@ -234,3 +239,3 @@ maxWidth: string | number;
      * `hideAtMedia` accepts only valid Media Queries.
-     * @default undefined
+     * @default 'undefined'
      */
@@ -269,3 +274,3 @@ hideAtMedia: string;
      * the first character must be an alphabet and should not contain spaces and special characters.
-     * @default undefined
+     * @default 'undefined'
      */
@@ -275,3 +280,3 @@ field?: string;
      * Gets the unique identifier value of the column. It is used to get the object.
-     * @default undefined
+     * @default 'undefined'
      */
@@ -282,3 +287,3 @@ uid?: string;
      * If `headerText` is not defined, then field name value will be assigned to header text.
-     * @default undefined
+     * @default 'undefined'
      */
@@ -288,3 +293,3 @@ headerText?: string;
      * Defines the width of the column in pixels or percentage.
-     * @default undefined
+     * @default 'undefined'
      */
@@ -294,3 +299,3 @@ width?: string | number;
      * Defines the minimum width of the column in pixels or percentage.
-     * @default undefined
+     * @default 'undefined'
      */
@@ -300,3 +305,3 @@ minWidth?: string | number;
      * Defines the sort comparer property.
-     * @default undefined
+     * @default 'undefined'
      */
@@ -306,3 +311,3 @@ sortComparer?: SortComparer | string;
      * Defines the maximum width of the column in pixels or percentage, which will restrict resizing beyond this pixels or percentage.
-     * @default undefined
+     * @default 'undefined'
      */
@@ -473,3 +478,3 @@ maxWidth?: string | number;
      * `hideAtMedia` accepts only valid Media Queries.
-     * @default undefined
+     * @default 'undefined'
      */
@@ -526,4 +531,9 @@ hideAtMedia?: string;
     /**
+     * If `showCheckbox` set to true, then the checkboxes will be displayed in particular column.
+     * @default false
+     */
+    showCheckbox?: boolean;
+    /**
      * Defines the type of component for editing.
-     * @default stringedit
+     * @default 'stringedit'
      */
@@ -530,0 +540,0 @@ editType?: string;

src/treegrid/models/selection-settings-model.d.ts

@@ -1,2 +0,2 @@
-import { Property, ChildProperty } from '@syncfusion/ej2-base';import { SelectionMode, CellSelectionMode, SelectionType } from '@syncfusion/ej2-grids';
+import { Property, ChildProperty } from '@syncfusion/ej2-base';import { SelectionMode, CellSelectionMode, SelectionType, CheckboxSelectionType } from '@syncfusion/ej2-grids';
 
@@ -47,2 +47,19 @@ /**
 
+    /**
+     * Defines options for checkbox selection Mode. They are 
+     * * `Default`: This is the default value of the checkboxMode. In this mode, user can select multiple rows by clicking rows one by one.
+     * * `ResetOnRowClick`: In ResetOnRowClick mode, on clicking a row it will reset previously selected row and also multiple
+     *  rows can be selected by using CTRL or SHIFT key.
+     * @default Default 
+     */
+    checkboxMode?: CheckboxSelectionType;
+
+    /**
+     * If 'checkboxOnly' set to true, then the TreeGrid selection is allowed only through checkbox.
+     * 
+     * > To enable checkboxOnly selection, should specify the column type as `checkbox`.
+     * @default false 
+     */
+    checkboxOnly?: boolean;
+
 }

src/treegrid/models/selection-settings.d.ts

 import { ChildProperty } from '@syncfusion/ej2-base';
-import { SelectionMode, CellSelectionMode, SelectionType } from '@syncfusion/ej2-grids';
+import { SelectionMode, CellSelectionMode, SelectionType, CheckboxSelectionType } from '@syncfusion/ej2-grids';
 /**
@@ -42,2 +42,17 @@ * Configures the selection behavior of the TreeGrid.
     persistSelection: boolean;
+    /**
+     * Defines options for checkbox selection Mode. They are
+     * * `Default`: This is the default value of the checkboxMode. In this mode, user can select multiple rows by clicking rows one by one.
+     * * `ResetOnRowClick`: In ResetOnRowClick mode, on clicking a row it will reset previously selected row and also multiple
+     *  rows can be selected by using CTRL or SHIFT key.
+     * @default Default
+     */
+    checkboxMode: CheckboxSelectionType;
+    /**
+     * If 'checkboxOnly' set to true, then the TreeGrid selection is allowed only through checkbox.
+     *
+     * > To enable checkboxOnly selection, should specify the column type as `checkbox`.
+     * @default false
+     */
+    checkboxOnly: boolean;
 }

src/treegrid/models/selection-settings.js

@@ -41,4 +41,10 @@ var __extends = (this && this.__extends) || (function () {
     ], SelectionSettings.prototype, "persistSelection", void 0);
+    __decorate([
+        Property('Default')
+    ], SelectionSettings.prototype, "checkboxMode", void 0);
+    __decorate([
+        Property(false)
+    ], SelectionSettings.prototype, "checkboxOnly", void 0);
     return SelectionSettings;
 }(ChildProperty));
 export { SelectionSettings };

src/treegrid/models/summary-model.d.ts

@@ -36,4 +36,4 @@ import { Property, ChildProperty, Collection, getEnumValue, compile, DateFormatOptions, NumberFormatOptions } from '@syncfusion/ej2-base';import { Internationalization } from '@syncfusion/ej2-base';import { CustomSummaryType, AggregateType, CellType } from '@syncfusion/ej2-grids';
     /**
-   * If `showChildSummary` is set to true, display TreeGrid child summary.
-   * @default true
+   * Defines the column name to perform aggregation.
+   * @default null
    */
@@ -40,0 +40,0 @@ field?: string;

src/treegrid/models/summary.d.ts

@@ -37,4 +37,4 @@ import { ChildProperty, DateFormatOptions, NumberFormatOptions } from '@syncfusion/ej2-base';
     /**
-     * If `showChildSummary` is set to true, display TreeGrid child summary.
-     * @default true
+     * Defines the column name to perform aggregation.
+     * @default null
      */
@@ -41,0 +41,0 @@ field: string;

src/treegrid/renderer/render.js

@@ -30,4 +30,4 @@ import { getObject } from '@syncfusion/ej2-grids';
             index = data.parentItem.index;
-            var collapsed = !(isNullOrUndefined(parentData[this.parent.expandStateMapping]) ||
-                parentData[this.parent.expandStateMapping]) || this.parent.enableCollapseAll ||
+            var collapsed = (this.parent.initialRender && (!(isNullOrUndefined(parentData[this.parent.expandStateMapping]) ||
+                parentData[this.parent.expandStateMapping]) || this.parent.enableCollapseAll)) ||
                 !getExpandStatus(this.parent, args.data, this.parent.grid.getCurrentViewRecords());
@@ -70,2 +70,5 @@ if (collapsed) {
         var totalIconsWidth = 0;
+        var cellElement;
+        var column = this.parent.getColumnByField(args.column.field);
+        var summaryRow = data.isSummaryRow;
         if (grid.getColumnIndexByUid(args.column.uid) === this.parent.treeColumnIndex) {
@@ -97,3 +100,3 @@ var container = createElement('div', {
                 else {
-                    expand = data.expanded;
+                    expand = !(!data.expanded || !getExpandStatus(this.parent, data, this.parent.grid.getCurrentViewRecords()));
                 }
@@ -123,3 +126,3 @@ var collapsed = true;
             // }
-            var cellElement = createElement('span', {
+            cellElement = createElement('span', {
                 className: 'e-treecell'
@@ -137,3 +140,11 @@ });
         }
-        var summaryRow = getObject('isSummaryRow', args.data);
+        if (!isNullOrUndefined(column) && column.showCheckbox) {
+            this.parent.notify('columnCheckbox', args);
+            if (this.parent.allowTextWrap) {
+                var checkboxElement = args.cell.querySelectorAll('.e-frame')[0];
+                var width = parseInt(checkboxElement.style.width, 16);
+                totalIconsWidth += width;
+                cellElement.style.width = 'Calc(100% - ' + totalIconsWidth + 'px)';
+            }
+        }
         if (summaryRow) {
@@ -140,0 +151,0 @@ addClass([args.cell], 'e-summarycell');

src/treegrid/utils.d.ts

@@ -19,1 +19,2 @@ import { TreeGrid } from './base/treegrid';
 export declare function getPlainData(value: ITreeData): ITreeData;
+export declare function getParentData(parent: TreeGrid, value: string, requireFilter?: Boolean): ITreeData;

src/treegrid/utils.js

@@ -34,3 +34,3 @@ import { getObject } from '@syncfusion/ej2-grids';
     var parentRecord = isNullOrUndefined(record.parentItem) ? null :
-        parents.filter(function (e) { return e.uniqueID === record.parentItem.uniqueID; })[0];
+        getParentData(parent, record.parentItem.uniqueID);
     var childParent;
@@ -47,3 +47,3 @@ if (parentRecord != null) {
         else if (parentRecord.parentItem) {
-            childParent = parents.filter(function (e) { return e.uniqueID === parentRecord.parentItem.uniqueID; })[0];
+            childParent = getParentData(parent, parentRecord.parentItem.uniqueID);
             if (childParent && parent.initialRender && !isNullOrUndefined(childParent[parent.expandStateMapping])
@@ -116,1 +116,11 @@ && !childParent[parent.expandStateMapping]) {
 }
+export function getParentData(parent, value, requireFilter) {
+    if (requireFilter) {
+        var idFilter = 'uniqueIDFilterCollection';
+        return parent[idFilter][value];
+    }
+    else {
+        var id = 'uniqueIDCollection';
+        return parent[id][value];
+    }
+}

No alert changes

Improved metrics

Total package byte prevSize

2649395

increased by9.8%

Dev dependency count

0

decreased by-100%

Number of package files

151

increased by7.86%

Lines of code

24662

increased by9.39%

Dependency changes

• Updated@syncfusion/ej2-base@~17.1.32-beta

• Updated@syncfusion/ej2-data@~17.1.32-beta

• Updated@syncfusion/ej2-grids@~17.1.32-beta

• Updated@syncfusion/ej2-popups@~17.1.32-beta