@syncfusion/ej2-lists 20.4.40 → 20.4.48
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +14 -0
- package/README.md +1 -1
- package/dist/ej2-lists.min.js +2 -2
- package/dist/ej2-lists.umd.min.js +2 -2
- package/dist/ej2-lists.umd.min.js.map +1 -1
- package/dist/es6/ej2-lists.es2015.js +26 -22
- package/dist/es6/ej2-lists.es2015.js.map +1 -1
- package/dist/es6/ej2-lists.es5.js +29 -24
- package/dist/es6/ej2-lists.es5.js.map +1 -1
- package/dist/global/ej2-lists.min.js +2 -2
- package/dist/global/ej2-lists.min.js.map +1 -1
- package/dist/global/index.d.ts +1 -1
- package/package.json +8 -8
- package/src/list-view/list-view.d.ts +1 -0
- package/src/list-view/list-view.js +29 -24
|
@@ -1462,7 +1462,7 @@ var ListView = /** @__PURE__ @class */ (function (_super) {
|
|
|
1462
1462
|
this.currentLiElements = [];
|
|
1463
1463
|
this.isNestedList = false;
|
|
1464
1464
|
this.selectedData = [];
|
|
1465
|
-
this.selectedId = [];
|
|
1465
|
+
this.selectedId = this.enablePersistence ? this.selectedId : [];
|
|
1466
1466
|
this.LISTVIEW_TEMPLATE_ID = "" + this.element.id + LISTVIEW_TEMPLATE_PROPERTY;
|
|
1467
1467
|
this.LISTVIEW_GROUPTEMPLATE_ID = "" + this.element.id + LISTVIEW_GROUPTEMPLATE_PROPERTY;
|
|
1468
1468
|
this.LISTVIEW_HEADERTEMPLATE_ID = "" + this.element.id + LISTVIEW_HEADERTEMPLATE_PROPERTY;
|
|
@@ -1474,12 +1474,13 @@ var ListView = /** @__PURE__ @class */ (function (_super) {
|
|
|
1474
1474
|
this.curUL = this.ulElement = this.liCollection = this.headerEle = this.contentContainer = undefined;
|
|
1475
1475
|
};
|
|
1476
1476
|
ListView.prototype.renderCheckbox = function (args) {
|
|
1477
|
+
var _this = this;
|
|
1477
1478
|
if (args.item.classList.contains(classNames.hasChild)) {
|
|
1478
1479
|
this.isNestedList = true;
|
|
1479
1480
|
}
|
|
1480
1481
|
if (this.showCheckBox && this.isValidLI(args.item)) {
|
|
1481
1482
|
var checkboxElement = void 0;
|
|
1482
|
-
var
|
|
1483
|
+
var fieldData_1;
|
|
1483
1484
|
// eslint-disable-next-line prefer-const
|
|
1484
1485
|
checkboxElement = createCheckBox(this.createElement, false, {
|
|
1485
1486
|
checked: false, enableRtl: this.enableRtl,
|
|
@@ -1490,8 +1491,14 @@ var ListView = /** @__PURE__ @class */ (function (_super) {
|
|
|
1490
1491
|
args.item.classList.add(classNames.itemCheckList);
|
|
1491
1492
|
args.item.firstElementChild.classList.add(classNames.checkbox);
|
|
1492
1493
|
if (typeof this.dataSource[0] !== 'string' && typeof this.dataSource[0] !== 'number') {
|
|
1493
|
-
|
|
1494
|
-
if (
|
|
1494
|
+
fieldData_1 = getFieldValues(args.curData, this.listBaseOption.fields);
|
|
1495
|
+
if (this.enablePersistence && !isNullOrUndefined(this.selectedId)) {
|
|
1496
|
+
var index = this.selectedId.findIndex(function (e) { return e == fieldData_1[_this.listBaseOption.fields.id].toString(); });
|
|
1497
|
+
if (index != -1) {
|
|
1498
|
+
this.checkInternally(args, checkboxElement);
|
|
1499
|
+
}
|
|
1500
|
+
}
|
|
1501
|
+
else if (fieldData_1[this.listBaseOption.fields.isChecked]) {
|
|
1495
1502
|
this.checkInternally(args, checkboxElement);
|
|
1496
1503
|
}
|
|
1497
1504
|
}
|
|
@@ -1522,7 +1529,6 @@ var ListView = /** @__PURE__ @class */ (function (_super) {
|
|
|
1522
1529
|
};
|
|
1523
1530
|
ListView.prototype.checkInternally = function (args, checkboxElement) {
|
|
1524
1531
|
args.item.classList.add(classNames.selected);
|
|
1525
|
-
args.item.setAttribute('aria-selected', 'true');
|
|
1526
1532
|
checkboxElement.querySelector('.' + classNames.checkboxIcon).classList.add(classNames.checked);
|
|
1527
1533
|
checkboxElement.setAttribute('aria-checked', 'true');
|
|
1528
1534
|
};
|
|
@@ -1548,7 +1554,6 @@ var ListView = /** @__PURE__ @class */ (function (_super) {
|
|
|
1548
1554
|
else {
|
|
1549
1555
|
liElement.classList.remove(classNames.selected);
|
|
1550
1556
|
}
|
|
1551
|
-
liElement.setAttribute('aria-selected', checked ? 'true' : 'false');
|
|
1552
1557
|
if (checked === true) {
|
|
1553
1558
|
checkboxIcon.classList.add(classNames.checked);
|
|
1554
1559
|
}
|
|
@@ -1558,6 +1563,7 @@ var ListView = /** @__PURE__ @class */ (function (_super) {
|
|
|
1558
1563
|
checkboxIcon.parentElement.setAttribute('aria-checked', checked ? 'true' : 'false');
|
|
1559
1564
|
}
|
|
1560
1565
|
this.setSelectedItemData(liElement);
|
|
1566
|
+
this.updateSelectedId();
|
|
1561
1567
|
}
|
|
1562
1568
|
};
|
|
1563
1569
|
/**
|
|
@@ -1600,6 +1606,7 @@ var ListView = /** @__PURE__ @class */ (function (_super) {
|
|
|
1600
1606
|
if (this.enableVirtualization) {
|
|
1601
1607
|
this.virtualizationModule.checkedItem(checked);
|
|
1602
1608
|
}
|
|
1609
|
+
this.updateSelectedId();
|
|
1603
1610
|
}
|
|
1604
1611
|
};
|
|
1605
1612
|
ListView.prototype.setCheckbox = function () {
|
|
@@ -1715,6 +1722,7 @@ var ListView = /** @__PURE__ @class */ (function (_super) {
|
|
|
1715
1722
|
}
|
|
1716
1723
|
}
|
|
1717
1724
|
}
|
|
1725
|
+
this.updateSelectedId();
|
|
1718
1726
|
};
|
|
1719
1727
|
ListView.prototype.removeElement = function (element) {
|
|
1720
1728
|
return element && element.parentNode && element.parentNode.removeChild(element);
|
|
@@ -1730,9 +1738,6 @@ var ListView = /** @__PURE__ @class */ (function (_super) {
|
|
|
1730
1738
|
ListView.prototype.homeKeyHandler = function (e, end) {
|
|
1731
1739
|
e.preventDefault();
|
|
1732
1740
|
if (Object.keys(this.dataSource).length && this.curUL) {
|
|
1733
|
-
if (this.selectedItems) {
|
|
1734
|
-
(this.selectedItems.item).setAttribute('aria-selected', 'false');
|
|
1735
|
-
}
|
|
1736
1741
|
var li = this.curUL.querySelectorAll('.' + classNames.listItem);
|
|
1737
1742
|
var focusedElement = this.curUL.querySelector('.' + classNames.focused) ||
|
|
1738
1743
|
this.curUL.querySelector('.' + classNames.selected);
|
|
@@ -1907,6 +1912,7 @@ var ListView = /** @__PURE__ @class */ (function (_super) {
|
|
|
1907
1912
|
var eventArgs = this.selectEventData(li, e);
|
|
1908
1913
|
merge(eventArgs, { isChecked: checkIcon ? checkIcon.classList.contains(classNames.checked) : false });
|
|
1909
1914
|
this.trigger('select', eventArgs);
|
|
1915
|
+
this.updateSelectedId();
|
|
1910
1916
|
}
|
|
1911
1917
|
};
|
|
1912
1918
|
ListView.prototype.keyActionHandler = function (e) {
|
|
@@ -1950,11 +1956,10 @@ var ListView = /** @__PURE__ @class */ (function (_super) {
|
|
|
1950
1956
|
ListView.prototype.focusout = function () {
|
|
1951
1957
|
if (Object.keys(this.dataSource).length && this.curUL) {
|
|
1952
1958
|
var focusedElement = this.curUL.querySelector('.' + classNames.focused);
|
|
1953
|
-
var activeElement = this.curUL.querySelector('[aria-selected = true]');
|
|
1954
1959
|
if (focusedElement) {
|
|
1955
1960
|
focusedElement.classList.remove(classNames.focused);
|
|
1956
|
-
if (
|
|
1957
|
-
|
|
1961
|
+
if (!this.showCheckBox) {
|
|
1962
|
+
this.selectedLI.classList.add(classNames.selected);
|
|
1958
1963
|
}
|
|
1959
1964
|
}
|
|
1960
1965
|
}
|
|
@@ -1997,14 +2002,12 @@ var ListView = /** @__PURE__ @class */ (function (_super) {
|
|
|
1997
2002
|
continue;
|
|
1998
2003
|
}
|
|
1999
2004
|
else {
|
|
2000
|
-
ele.setAttribute('aria-selected', 'false');
|
|
2001
2005
|
ele.classList.remove(classNames.selected);
|
|
2002
2006
|
}
|
|
2003
2007
|
}
|
|
2004
2008
|
}
|
|
2005
2009
|
else {
|
|
2006
2010
|
li.classList.remove(classNames.selected);
|
|
2007
|
-
li.setAttribute('aria-selected', 'false');
|
|
2008
2011
|
}
|
|
2009
2012
|
};
|
|
2010
2013
|
ListView.prototype.isValidLI = function (li) {
|
|
@@ -2030,12 +2033,10 @@ var ListView = /** @__PURE__ @class */ (function (_super) {
|
|
|
2030
2033
|
if (!checkIcon.classList.contains(classNames.checked)) {
|
|
2031
2034
|
checkIcon.classList.add(classNames.checked);
|
|
2032
2035
|
li.classList.add(classNames.selected);
|
|
2033
|
-
li.setAttribute('aria-selected', 'true');
|
|
2034
2036
|
}
|
|
2035
2037
|
else {
|
|
2036
2038
|
checkIcon.classList.remove(classNames.checked);
|
|
2037
2039
|
li.classList.remove(classNames.selected);
|
|
2038
|
-
li.setAttribute('aria-selected', 'false');
|
|
2039
2040
|
}
|
|
2040
2041
|
checkboxElement.setAttribute('aria-checked', checkIcon.classList.contains(classNames.checked) ?
|
|
2041
2042
|
'true' : 'false');
|
|
@@ -2102,7 +2103,6 @@ var ListView = /** @__PURE__ @class */ (function (_super) {
|
|
|
2102
2103
|
this.removeSelect();
|
|
2103
2104
|
}
|
|
2104
2105
|
li.classList.add(classNames.selected);
|
|
2105
|
-
li.setAttribute('aria-selected', 'true');
|
|
2106
2106
|
this.removeHover();
|
|
2107
2107
|
this.setSelectedItemData(li);
|
|
2108
2108
|
if (this.enableVirtualization) {
|
|
@@ -2324,7 +2324,6 @@ var ListView = /** @__PURE__ @class */ (function (_super) {
|
|
|
2324
2324
|
var element = liElements[i];
|
|
2325
2325
|
if (element.classList.contains('e-list-item')) {
|
|
2326
2326
|
element.setAttribute('id', this.element.id + '_' + element.getAttribute('data-uid'));
|
|
2327
|
-
element.setAttribute('aria-selected', 'false');
|
|
2328
2327
|
element.setAttribute('tabindex', '-1');
|
|
2329
2328
|
}
|
|
2330
2329
|
}
|
|
@@ -2489,12 +2488,8 @@ var ListView = /** @__PURE__ @class */ (function (_super) {
|
|
|
2489
2488
|
var li = this.element.querySelector('[data-uid=\'' + pID + '\']');
|
|
2490
2489
|
li.classList.remove(classNames.disable);
|
|
2491
2490
|
li.classList.add(classNames.focused);
|
|
2492
|
-
if (this.showCheckBox && li.querySelector('.' + classNames.checkboxIcon).classList.contains(classNames.checked)) {
|
|
2493
|
-
li.setAttribute('aria-selected', 'true');
|
|
2494
|
-
}
|
|
2495
|
-
else {
|
|
2491
|
+
if (!(this.showCheckBox && li.querySelector('.' + classNames.checkboxIcon).classList.contains(classNames.checked))) {
|
|
2496
2492
|
li.classList.remove(classNames.selected);
|
|
2497
|
-
li.setAttribute('aria-selected', 'false');
|
|
2498
2493
|
}
|
|
2499
2494
|
this.liCollection = this.curUL.querySelectorAll('.' + classNames.listItem);
|
|
2500
2495
|
if (this.enableHtmlSanitizer) {
|
|
@@ -2594,6 +2589,16 @@ var ListView = /** @__PURE__ @class */ (function (_super) {
|
|
|
2594
2589
|
}
|
|
2595
2590
|
return parentId;
|
|
2596
2591
|
};
|
|
2592
|
+
ListView.prototype.updateSelectedId = function () {
|
|
2593
|
+
this.selectedId = [];
|
|
2594
|
+
var liCollection = this.curUL.getElementsByClassName(classNames.selected);
|
|
2595
|
+
for (var i = 0; i < liCollection.length; i++) {
|
|
2596
|
+
var tempData = this.getItemData(liCollection[i]);
|
|
2597
|
+
if (tempData[this.listBaseOption.fields.id]) {
|
|
2598
|
+
this.selectedId.push(tempData[this.listBaseOption.fields.id]);
|
|
2599
|
+
}
|
|
2600
|
+
}
|
|
2601
|
+
};
|
|
2597
2602
|
/**
|
|
2598
2603
|
* Gets the details of the currently selected item from the list items.
|
|
2599
2604
|
*
|
|
@@ -3025,7 +3030,7 @@ var ListView = /** @__PURE__ @class */ (function (_super) {
|
|
|
3025
3030
|
ListView.prototype.getPersistData = function () {
|
|
3026
3031
|
return this.addOnPersist(['cssClass', 'enableRtl', 'htmlAttributes',
|
|
3027
3032
|
'enable', 'fields', 'animation', 'headerTitle',
|
|
3028
|
-
'sortOrder', 'showIcon', 'height', 'width', 'showCheckBox', 'checkBoxPosition']);
|
|
3033
|
+
'sortOrder', 'showIcon', 'height', 'width', 'showCheckBox', 'checkBoxPosition', 'selectedId']);
|
|
3029
3034
|
};
|
|
3030
3035
|
__decorate([
|
|
3031
3036
|
Property('')
|