@syncfusion/ej2-dropdowns 25.2.7-130084 → 26.1.35
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/.eslintrc.json +3 -2
- package/{ReadMe.md → README.md} +1 -1
- package/dist/ej2-dropdowns.min.js +10 -1
- package/dist/ej2-dropdowns.umd.min.js +10 -1
- package/dist/ej2-dropdowns.umd.min.js.map +1 -1
- package/dist/es6/ej2-dropdowns.es2015.js +505 -215
- package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
- package/dist/es6/ej2-dropdowns.es5.js +498 -207
- package/dist/es6/ej2-dropdowns.es5.js.map +1 -1
- package/dist/global/ej2-dropdowns.min.js +10 -1
- package/dist/global/ej2-dropdowns.min.js.map +1 -1
- package/dist/global/index.d.ts +9 -0
- package/package.json +80 -79
- package/src/auto-complete/auto-complete-model.d.ts +10 -10
- package/src/auto-complete/auto-complete.d.ts +12 -12
- package/src/auto-complete/auto-complete.js +3 -3
- package/src/combo-box/combo-box-model.d.ts +17 -17
- package/src/combo-box/combo-box.d.ts +27 -27
- package/src/combo-box/combo-box.js +25 -10
- package/src/common/interface.js +0 -1
- package/src/common/virtual-scroll.js +1 -0
- package/src/drop-down-base/drop-down-base-model.d.ts +21 -14
- package/src/drop-down-base/drop-down-base.d.ts +43 -17
- package/src/drop-down-base/drop-down-base.js +65 -10
- package/src/drop-down-list/drop-down-list-model.d.ts +3 -3
- package/src/drop-down-list/drop-down-list.d.ts +19 -5
- package/src/drop-down-list/drop-down-list.js +130 -5
- package/src/drop-down-tree/drop-down-tree-model.d.ts +16 -16
- package/src/drop-down-tree/drop-down-tree.d.ts +18 -14
- package/src/drop-down-tree/drop-down-tree.js +52 -38
- package/src/list-box/list-box-model.d.ts +2 -2
- package/src/list-box/list-box.d.ts +2 -2
- package/src/list-box/list-box.js +30 -9
- package/src/mention/mention.js +23 -8
- package/src/multi-select/interface.js +0 -1
- package/src/multi-select/multi-select.d.ts +15 -0
- package/src/multi-select/multi-select.js +135 -12
- package/styles/auto-complete/_bootstrap5.3-definition.scss +2 -0
- package/styles/auto-complete/_fluent2-definition.scss +2 -0
- package/styles/auto-complete/bootstrap-dark.css +5 -2
- package/styles/auto-complete/bootstrap.css +5 -2
- package/styles/auto-complete/bootstrap4.css +6 -2
- package/styles/auto-complete/bootstrap5-dark.css +6 -2
- package/styles/auto-complete/bootstrap5.css +6 -2
- package/styles/auto-complete/fabric-dark.css +3 -1
- package/styles/auto-complete/fabric.css +3 -1
- package/styles/auto-complete/fluent-dark.css +6 -2
- package/styles/auto-complete/fluent.css +6 -2
- package/styles/auto-complete/fluent2.css +1140 -0
- package/styles/auto-complete/fluent2.scss +4 -0
- package/styles/auto-complete/highcontrast-light.css +3 -1
- package/styles/auto-complete/highcontrast.css +3 -1
- package/styles/auto-complete/material-dark.css +16 -5
- package/styles/auto-complete/material.css +16 -5
- package/styles/auto-complete/material3-dark.css +17 -6
- package/styles/auto-complete/material3-dark.scss +1 -1
- package/styles/auto-complete/material3.css +17 -6
- package/styles/auto-complete/material3.scss +1 -1
- package/styles/auto-complete/tailwind-dark.css +16 -5
- package/styles/auto-complete/tailwind.css +16 -5
- package/styles/bootstrap-dark.css +196 -228
- package/styles/bootstrap-dark.scss +28 -8
- package/styles/bootstrap.css +196 -228
- package/styles/bootstrap.scss +28 -8
- package/styles/bootstrap4.css +199 -229
- package/styles/bootstrap4.scss +28 -8
- package/styles/bootstrap5-dark.css +196 -221
- package/styles/bootstrap5-dark.scss +28 -8
- package/styles/bootstrap5.css +196 -221
- package/styles/bootstrap5.scss +28 -8
- package/styles/combo-box/_bootstrap5.3-definition.scss +2 -0
- package/styles/combo-box/_fluent2-definition.scss +2 -0
- package/styles/combo-box/bootstrap-dark.css +5 -2
- package/styles/combo-box/bootstrap.css +5 -2
- package/styles/combo-box/bootstrap4.css +6 -2
- package/styles/combo-box/bootstrap5-dark.css +6 -2
- package/styles/combo-box/bootstrap5.css +6 -2
- package/styles/combo-box/fabric-dark.css +3 -1
- package/styles/combo-box/fabric.css +3 -1
- package/styles/combo-box/fluent-dark.css +6 -2
- package/styles/combo-box/fluent.css +6 -2
- package/styles/combo-box/fluent2.css +1140 -0
- package/styles/combo-box/fluent2.scss +4 -0
- package/styles/combo-box/highcontrast-light.css +3 -1
- package/styles/combo-box/highcontrast.css +3 -1
- package/styles/combo-box/material-dark.css +16 -5
- package/styles/combo-box/material.css +16 -5
- package/styles/combo-box/material3-dark.css +17 -6
- package/styles/combo-box/material3-dark.scss +1 -1
- package/styles/combo-box/material3.css +17 -6
- package/styles/combo-box/material3.scss +1 -1
- package/styles/combo-box/tailwind-dark.css +16 -5
- package/styles/combo-box/tailwind.css +16 -5
- package/styles/drop-down-base/_bds-definition.scss +2 -2
- package/styles/drop-down-base/_bootstrap5.3-definition.scss +117 -0
- package/styles/drop-down-base/_fluent2-definition.scss +134 -0
- package/styles/drop-down-base/_layout.scss +12 -2
- package/styles/drop-down-base/_material3-definition.scss +0 -11
- package/styles/drop-down-base/_theme.scss +2 -11
- package/styles/drop-down-base/bootstrap-dark.css +2 -1
- package/styles/drop-down-base/bootstrap.css +2 -1
- package/styles/drop-down-base/bootstrap4.css +2 -1
- package/styles/drop-down-base/bootstrap5-dark.css +2 -1
- package/styles/drop-down-base/bootstrap5.css +2 -1
- package/styles/drop-down-base/fabric-dark.css +2 -1
- package/styles/drop-down-base/fabric.css +2 -1
- package/styles/drop-down-base/fluent-dark.css +2 -1
- package/styles/drop-down-base/fluent.css +2 -1
- package/styles/drop-down-base/fluent2.css +1447 -0
- package/styles/drop-down-base/fluent2.scss +3 -0
- package/styles/drop-down-base/highcontrast-light.css +2 -1
- package/styles/drop-down-base/highcontrast.css +2 -1
- package/styles/drop-down-base/material-dark.css +2 -1
- package/styles/drop-down-base/material.css +2 -1
- package/styles/drop-down-base/material3-dark.css +9 -2
- package/styles/drop-down-base/material3-dark.scss +1 -1
- package/styles/drop-down-base/material3.css +9 -2
- package/styles/drop-down-base/material3.scss +1 -1
- package/styles/drop-down-base/tailwind-dark.css +2 -1
- package/styles/drop-down-base/tailwind.css +2 -1
- package/styles/drop-down-list/_bootstrap5.3-definition.scss +201 -0
- package/styles/drop-down-list/_fluent2-definition.scss +134 -0
- package/styles/drop-down-list/_layout.scss +5 -3
- package/styles/drop-down-list/_material3-definition.scss +0 -8
- package/styles/drop-down-list/bootstrap-dark.css +38 -3
- package/styles/drop-down-list/bootstrap.css +38 -3
- package/styles/drop-down-list/bootstrap4.css +39 -3
- package/styles/drop-down-list/bootstrap5-dark.css +39 -3
- package/styles/drop-down-list/bootstrap5.css +39 -3
- package/styles/drop-down-list/fabric-dark.css +36 -2
- package/styles/drop-down-list/fabric.css +36 -2
- package/styles/drop-down-list/fluent-dark.css +39 -3
- package/styles/drop-down-list/fluent.css +39 -3
- package/styles/drop-down-list/fluent2.css +1684 -0
- package/styles/drop-down-list/fluent2.scss +9 -0
- package/styles/drop-down-list/highcontrast-light.css +36 -2
- package/styles/drop-down-list/highcontrast.css +36 -2
- package/styles/drop-down-list/icons/_bootstrap5.3.scss +14 -0
- package/styles/drop-down-list/icons/_fluent2.scss +14 -0
- package/styles/drop-down-list/material-dark.css +58 -7
- package/styles/drop-down-list/material.css +72 -9
- package/styles/drop-down-list/material3-dark.css +74 -10
- package/styles/drop-down-list/material3-dark.scss +1 -1
- package/styles/drop-down-list/material3.css +74 -10
- package/styles/drop-down-list/material3.scss +1 -1
- package/styles/drop-down-list/tailwind-dark.css +49 -6
- package/styles/drop-down-list/tailwind.css +49 -6
- package/styles/drop-down-tree/_bds-definition.scss +5 -0
- package/styles/drop-down-tree/_bootstrap4-definition.scss +1 -0
- package/styles/drop-down-tree/_bootstrap5-definition.scss +5 -0
- package/styles/drop-down-tree/_bootstrap5.3-definition.scss +66 -0
- package/styles/drop-down-tree/_fluent-definition.scss +4 -0
- package/styles/drop-down-tree/_fluent2-definition.scss +75 -0
- package/styles/drop-down-tree/_layout.scss +289 -327
- package/styles/drop-down-tree/_material3-definition.scss +3 -5
- package/styles/drop-down-tree/_tailwind-definition.scss +7 -2
- package/styles/drop-down-tree/_theme.scss +24 -41
- package/styles/drop-down-tree/bootstrap-dark.css +63 -29
- package/styles/drop-down-tree/bootstrap.css +63 -29
- package/styles/drop-down-tree/bootstrap4.css +64 -30
- package/styles/drop-down-tree/bootstrap5-dark.css +63 -27
- package/styles/drop-down-tree/bootstrap5.css +63 -27
- package/styles/drop-down-tree/fabric-dark.css +63 -29
- package/styles/drop-down-tree/fabric.css +63 -29
- package/styles/drop-down-tree/fluent-dark.css +71 -35
- package/styles/drop-down-tree/fluent.css +71 -35
- package/styles/drop-down-tree/fluent2.css +1732 -0
- package/styles/drop-down-tree/fluent2.scss +9 -0
- package/styles/drop-down-tree/highcontrast-light.css +63 -29
- package/styles/drop-down-tree/highcontrast.css +63 -23
- package/styles/drop-down-tree/icons/_bootstrap5.3.scss +11 -0
- package/styles/drop-down-tree/icons/_fluent2.scss +14 -0
- package/styles/drop-down-tree/material-dark.css +80 -43
- package/styles/drop-down-tree/material.css +97 -51
- package/styles/drop-down-tree/material3-dark.css +85 -32
- package/styles/drop-down-tree/material3-dark.scss +1 -1
- package/styles/drop-down-tree/material3.css +85 -32
- package/styles/drop-down-tree/material3.scss +1 -1
- package/styles/drop-down-tree/tailwind-dark.css +72 -28
- package/styles/drop-down-tree/tailwind.css +72 -28
- package/styles/fabric-dark.css +194 -227
- package/styles/fabric-dark.scss +28 -8
- package/styles/fabric.css +194 -227
- package/styles/fabric.scss +28 -8
- package/styles/fluent-dark.css +206 -236
- package/styles/fluent-dark.scss +28 -8
- package/styles/fluent.css +206 -236
- package/styles/fluent.scss +28 -8
- package/styles/fluent2.css +4771 -0
- package/styles/fluent2.scss +28 -0
- package/styles/highcontrast-light.css +197 -227
- package/styles/highcontrast-light.scss +28 -8
- package/styles/highcontrast.css +197 -221
- package/styles/highcontrast.scss +28 -8
- package/styles/list-box/_bootstrap-dark-definition.scss +0 -2
- package/styles/list-box/_bootstrap5.3-definition.scss +120 -0
- package/styles/list-box/_fabric-dark-definition.scss +0 -2
- package/styles/list-box/_fluent2-definition.scss +121 -0
- package/styles/list-box/_highcontrast-light-definition.scss +0 -2
- package/styles/list-box/_layout.scss +65 -44
- package/styles/list-box/_material-dark-definition.scss +0 -2
- package/styles/list-box/_tailwind-definition.scss +1 -1
- package/styles/list-box/_theme.scss +36 -65
- package/styles/list-box/bootstrap-dark.css +72 -112
- package/styles/list-box/bootstrap.css +72 -112
- package/styles/list-box/bootstrap4.css +72 -112
- package/styles/list-box/bootstrap5-dark.css +72 -106
- package/styles/list-box/bootstrap5.css +72 -106
- package/styles/list-box/fabric-dark.css +72 -112
- package/styles/list-box/fabric.css +72 -112
- package/styles/list-box/fluent-dark.css +72 -112
- package/styles/list-box/fluent.css +72 -112
- package/styles/list-box/fluent2.css +2029 -0
- package/styles/list-box/fluent2.scss +5 -0
- package/styles/list-box/highcontrast-light.css +72 -112
- package/styles/list-box/highcontrast.css +72 -112
- package/styles/list-box/icons/_bootstrap5.3.scss +25 -0
- package/styles/list-box/icons/_fluent2.scss +25 -0
- package/styles/list-box/material-dark.css +72 -112
- package/styles/list-box/material.css +72 -112
- package/styles/list-box/material3-dark.css +73 -113
- package/styles/list-box/material3-dark.scss +1 -1
- package/styles/list-box/material3.css +73 -113
- package/styles/list-box/material3.scss +1 -1
- package/styles/list-box/tailwind-dark.css +74 -114
- package/styles/list-box/tailwind.css +74 -114
- package/styles/material-dark.css +236 -260
- package/styles/material-dark.scss +28 -8
- package/styles/material.css +253 -284
- package/styles/material.scss +28 -8
- package/styles/material3-dark.css +253 -266
- package/styles/material3-dark.scss +29 -9
- package/styles/material3.css +253 -266
- package/styles/material3.scss +29 -9
- package/styles/mention/_bootstrap5.3-definition.scss +1 -0
- package/styles/mention/_fluent2-definition.scss +1 -0
- package/styles/mention/bootstrap-dark.css +24 -0
- package/styles/mention/bootstrap.css +24 -0
- package/styles/mention/bootstrap4.css +24 -0
- package/styles/mention/bootstrap5-dark.css +24 -0
- package/styles/mention/bootstrap5.css +24 -0
- package/styles/mention/fabric-dark.css +24 -0
- package/styles/mention/fabric.css +24 -0
- package/styles/mention/fluent-dark.css +24 -0
- package/styles/mention/fluent.css +24 -0
- package/styles/mention/fluent2.css +1130 -0
- package/styles/mention/fluent2.scss +6 -0
- package/styles/mention/highcontrast-light.css +24 -0
- package/styles/mention/highcontrast.css +24 -0
- package/styles/mention/material-dark.css +24 -0
- package/styles/mention/material.css +24 -0
- package/styles/mention/material3-dark.css +25 -1
- package/styles/mention/material3-dark.scss +1 -1
- package/styles/mention/material3.css +25 -1
- package/styles/mention/material3.scss +1 -1
- package/styles/mention/tailwind-dark.css +24 -0
- package/styles/mention/tailwind.css +24 -0
- package/styles/multi-select/_bootstrap5.3-definition.scss +230 -0
- package/styles/multi-select/_fluent2-definition.scss +236 -0
- package/styles/multi-select/_layout.scss +32 -38
- package/styles/multi-select/_material3-definition.scss +0 -15
- package/styles/multi-select/_theme.scss +0 -4
- package/styles/multi-select/bootstrap-dark.css +67 -28
- package/styles/multi-select/bootstrap.css +67 -28
- package/styles/multi-select/bootstrap4.css +70 -29
- package/styles/multi-select/bootstrap5-dark.css +67 -28
- package/styles/multi-select/bootstrap5.css +67 -28
- package/styles/multi-select/fabric-dark.css +67 -28
- package/styles/multi-select/fabric.css +67 -28
- package/styles/multi-select/fluent-dark.css +69 -29
- package/styles/multi-select/fluent.css +69 -29
- package/styles/multi-select/fluent2.css +2663 -0
- package/styles/multi-select/fluent2.scss +9 -0
- package/styles/multi-select/highcontrast-light.css +70 -28
- package/styles/multi-select/highcontrast.css +70 -28
- package/styles/multi-select/icons/_bootstrap5.3.scss +26 -0
- package/styles/multi-select/icons/_fluent2.scss +692 -0
- package/styles/multi-select/material-dark.css +88 -32
- package/styles/multi-select/material.css +102 -34
- package/styles/multi-select/material3-dark.css +109 -35
- package/styles/multi-select/material3-dark.scss +1 -1
- package/styles/multi-select/material3.css +109 -35
- package/styles/multi-select/material3.scss +1 -1
- package/styles/multi-select/tailwind-dark.css +67 -28
- package/styles/multi-select/tailwind.css +67 -28
- package/styles/tailwind-dark.css +217 -233
- package/styles/tailwind-dark.scss +28 -8
- package/styles/tailwind.css +217 -233
- package/styles/tailwind.scss +28 -8
- package/CHANGELOG.md +0 -2200
|
@@ -44,6 +44,9 @@ var FieldSettings = /** @class */ (function (_super) {
|
|
|
44
44
|
__decorate([
|
|
45
45
|
Property()
|
|
46
46
|
], FieldSettings.prototype, "htmlAttributes", void 0);
|
|
47
|
+
__decorate([
|
|
48
|
+
Property()
|
|
49
|
+
], FieldSettings.prototype, "disabled", void 0);
|
|
47
50
|
return FieldSettings;
|
|
48
51
|
}(ChildProperty));
|
|
49
52
|
export { FieldSettings };
|
|
@@ -87,7 +90,6 @@ var DropDownBase = /** @class */ (function (_super) {
|
|
|
87
90
|
function DropDownBase(options, element) {
|
|
88
91
|
var _this = _super.call(this, options, element) || this;
|
|
89
92
|
_this.preventChange = false;
|
|
90
|
-
_this.isAngular = false;
|
|
91
93
|
_this.isPreventChange = false;
|
|
92
94
|
_this.isDynamicDataChange = false;
|
|
93
95
|
_this.addedNewItem = false;
|
|
@@ -298,7 +300,7 @@ var DropDownBase = /** @class */ (function (_super) {
|
|
|
298
300
|
};
|
|
299
301
|
DropDownBase.prototype.l10nUpdate = function (actionFailure) {
|
|
300
302
|
var ele = this.getModuleName() === 'listbox' ? this.ulElement : this.list;
|
|
301
|
-
if (this.noRecordsTemplate !== 'No records found' || this.actionFailureTemplate !== 'Request failed') {
|
|
303
|
+
if ((!isNullOrUndefined(this.noRecordsTemplate) && this.noRecordsTemplate !== 'No records found') || this.actionFailureTemplate !== 'Request failed') {
|
|
302
304
|
var template = actionFailure ? this.actionFailureTemplate : this.noRecordsTemplate;
|
|
303
305
|
var compiledString = void 0;
|
|
304
306
|
var templateId = actionFailure ? this.actionFailureTemplateId : this.noRecordsTemplateId;
|
|
@@ -460,7 +462,7 @@ var DropDownBase = /** @class */ (function (_super) {
|
|
|
460
462
|
DropDownBase.prototype.getTransformValues = function () {
|
|
461
463
|
var translateY = this.viewPortInfo.startIndex * this.listItemHeight;
|
|
462
464
|
translateY = translateY - (this.skeletonCount * this.listItemHeight);
|
|
463
|
-
translateY = this.viewPortInfo.startIndex === 0 && this.listData && this.listData.length === 0 ? 0 : translateY;
|
|
465
|
+
translateY = ((this.viewPortInfo.startIndex === 0 && this.listData && this.listData.length === 0) || this.skeletonCount === 0) ? 0 : translateY;
|
|
464
466
|
var styleText = "transform: translate(0px, " + translateY + "px);";
|
|
465
467
|
return styleText;
|
|
466
468
|
};
|
|
@@ -605,17 +607,18 @@ var DropDownBase = /** @class */ (function (_super) {
|
|
|
605
607
|
}
|
|
606
608
|
element.querySelectorAll('select>option');
|
|
607
609
|
}
|
|
608
|
-
this.updateFields(fields.text, fields.value, this.fields.groupBy, this.fields.htmlAttributes, this.fields.iconCss);
|
|
610
|
+
this.updateFields(fields.text, fields.value, this.fields.groupBy, this.fields.htmlAttributes, this.fields.iconCss, this.fields.disabled);
|
|
609
611
|
this.resetList(jsonElement, fields);
|
|
610
612
|
};
|
|
611
|
-
DropDownBase.prototype.updateFields = function (text, value, groupBy, htmlAttributes, iconCss) {
|
|
613
|
+
DropDownBase.prototype.updateFields = function (text, value, groupBy, htmlAttributes, iconCss, disabled) {
|
|
612
614
|
var field = {
|
|
613
615
|
'fields': {
|
|
614
616
|
text: text,
|
|
615
617
|
value: value,
|
|
616
618
|
groupBy: !isNullOrUndefined(groupBy) ? groupBy : this.fields && this.fields.groupBy,
|
|
617
619
|
htmlAttributes: !isNullOrUndefined(htmlAttributes) ? htmlAttributes : this.fields && this.fields.htmlAttributes,
|
|
618
|
-
iconCss: !isNullOrUndefined(iconCss) ? iconCss : this.fields && this.fields.iconCss
|
|
620
|
+
iconCss: !isNullOrUndefined(iconCss) ? iconCss : this.fields && this.fields.iconCss,
|
|
621
|
+
disabled: !isNullOrUndefined(disabled) ? disabled : this.fields && this.fields.disabled
|
|
619
622
|
}
|
|
620
623
|
};
|
|
621
624
|
this.setProperties(field, true);
|
|
@@ -986,8 +989,16 @@ var DropDownBase = /** @class */ (function (_super) {
|
|
|
986
989
|
};
|
|
987
990
|
/* eslint-disable @typescript-eslint/no-unused-vars */
|
|
988
991
|
DropDownBase.prototype.postRender = function (listElement, list, bindEvent) {
|
|
992
|
+
if (this.fields.disabled) {
|
|
993
|
+
var liCollections = listElement.querySelectorAll('.' + dropDownBaseClasses.li);
|
|
994
|
+
for (var index = 0; index < liCollections.length; index++) {
|
|
995
|
+
if (JSON.parse(JSON.stringify(this.listData[index]))[this.fields.disabled]) {
|
|
996
|
+
this.disableListItem(liCollections[index]);
|
|
997
|
+
}
|
|
998
|
+
}
|
|
999
|
+
}
|
|
989
1000
|
/* eslint-enable @typescript-eslint/no-unused-vars */
|
|
990
|
-
var focusItem = listElement.querySelector('.' + dropDownBaseClasses.li);
|
|
1001
|
+
var focusItem = this.fields.disabled ? listElement.querySelector('.' + dropDownBaseClasses.li + ':not(.e-disabled') : listElement.querySelector('.' + dropDownBaseClasses.li);
|
|
991
1002
|
var selectedItem = listElement.querySelector('.' + dropDownBaseClasses.selected);
|
|
992
1003
|
if (focusItem && !selectedItem) {
|
|
993
1004
|
focusItem.classList.add(dropDownBaseClasses.focus);
|
|
@@ -1341,7 +1352,13 @@ var DropDownBase = /** @class */ (function (_super) {
|
|
|
1341
1352
|
*/
|
|
1342
1353
|
DropDownBase.prototype.getIndexByValue = function (value) {
|
|
1343
1354
|
var index;
|
|
1344
|
-
var listItems =
|
|
1355
|
+
var listItems = [];
|
|
1356
|
+
if (this.fields.disabled && this.getModuleName() === 'multiselect' && this.liCollections) {
|
|
1357
|
+
listItems = this.liCollections;
|
|
1358
|
+
}
|
|
1359
|
+
else {
|
|
1360
|
+
listItems = this.getItems();
|
|
1361
|
+
}
|
|
1345
1362
|
for (var i = 0; i < listItems.length; i++) {
|
|
1346
1363
|
if (!isNullOrUndefined(value) && listItems[i].getAttribute('data-value') === value.toString()) {
|
|
1347
1364
|
index = i;
|
|
@@ -1575,7 +1592,7 @@ var DropDownBase = /** @class */ (function (_super) {
|
|
|
1575
1592
|
* @param { Object[] } items - Specifies an array of JSON data or a JSON data.
|
|
1576
1593
|
* @param { number } itemIndex - Specifies the index to place the newly added item in the popup list.
|
|
1577
1594
|
* @returns {void}
|
|
1578
|
-
|
|
1595
|
+
|
|
1579
1596
|
*/
|
|
1580
1597
|
DropDownBase.prototype.addItem = function (items, itemIndex) {
|
|
1581
1598
|
if (!this.list || (this.list.textContent === this.noRecordsTemplate && this.getModuleName() !== 'listbox')) {
|
|
@@ -1630,6 +1647,9 @@ var DropDownBase = /** @class */ (function (_super) {
|
|
|
1630
1647
|
this.notify('addItem', { module: 'CheckBoxSelection', item: li });
|
|
1631
1648
|
liCollections.push(li);
|
|
1632
1649
|
if (this.getModuleName() === 'listbox') {
|
|
1650
|
+
if (item.disabled) {
|
|
1651
|
+
li.classList.add('e-disabled');
|
|
1652
|
+
}
|
|
1633
1653
|
this.listData.splice(isListboxEmpty ? this.listData.length : index, 0, item);
|
|
1634
1654
|
if (this.listData.length !== this.sortedData.length) {
|
|
1635
1655
|
this.sortedData = this.listData;
|
|
@@ -1715,6 +1735,41 @@ var DropDownBase = /** @class */ (function (_super) {
|
|
|
1715
1735
|
}
|
|
1716
1736
|
this.addedNewItem = true;
|
|
1717
1737
|
};
|
|
1738
|
+
/**
|
|
1739
|
+
* Checks if the given HTML element is disabled.
|
|
1740
|
+
*
|
|
1741
|
+
* @param {HTMLElement} li - The HTML element to check.
|
|
1742
|
+
* @returns {boolean} - Returns true if the element is disabled, otherwise false.
|
|
1743
|
+
*/
|
|
1744
|
+
DropDownBase.prototype.isDisabledElement = function (li) {
|
|
1745
|
+
if (li && li.classList.contains('e-disabled')) {
|
|
1746
|
+
return true;
|
|
1747
|
+
}
|
|
1748
|
+
return false;
|
|
1749
|
+
};
|
|
1750
|
+
/**
|
|
1751
|
+
* Checks whether the list item at the specified index is disabled.
|
|
1752
|
+
*
|
|
1753
|
+
* @param {number} index - The index of the list item to check.
|
|
1754
|
+
* @returns {boolean} True if the list item is disabled, false otherwise.
|
|
1755
|
+
*/
|
|
1756
|
+
DropDownBase.prototype.isDisabledItemByIndex = function (index) {
|
|
1757
|
+
if (this.fields.disabled && this.liCollections) {
|
|
1758
|
+
return this.isDisabledElement(this.liCollections[index]);
|
|
1759
|
+
}
|
|
1760
|
+
return false;
|
|
1761
|
+
};
|
|
1762
|
+
/**
|
|
1763
|
+
* Disables the given list item.
|
|
1764
|
+
*
|
|
1765
|
+
* @param { HTMLLIElement } li - The list item to disable.
|
|
1766
|
+
* @returns {void}
|
|
1767
|
+
*/
|
|
1768
|
+
DropDownBase.prototype.disableListItem = function (li) {
|
|
1769
|
+
li.classList.add('e-disabled');
|
|
1770
|
+
li.setAttribute('aria-disabled', 'true');
|
|
1771
|
+
li.setAttribute('aria-selected', 'false');
|
|
1772
|
+
};
|
|
1718
1773
|
DropDownBase.prototype.validationAttribute = function (target, hidden) {
|
|
1719
1774
|
var name = target.getAttribute('name') ? target.getAttribute('name') : target.getAttribute('id');
|
|
1720
1775
|
hidden.setAttribute('name', name);
|
|
@@ -1798,7 +1853,7 @@ var DropDownBase = /** @class */ (function (_super) {
|
|
|
1798
1853
|
_super.prototype.destroy.call(this);
|
|
1799
1854
|
};
|
|
1800
1855
|
__decorate([
|
|
1801
|
-
Complex({ text: null, value: null, iconCss: null, groupBy: null }, FieldSettings)
|
|
1856
|
+
Complex({ text: null, value: null, iconCss: null, groupBy: null, disabled: null }, FieldSettings)
|
|
1802
1857
|
], DropDownBase.prototype, "fields", void 0);
|
|
1803
1858
|
__decorate([
|
|
1804
1859
|
Property(null)
|
|
@@ -27,7 +27,7 @@ export interface DropDownListModel extends DropDownBaseModel{
|
|
|
27
27
|
* Specifies a value that indicates whether the component is enabled or not.
|
|
28
28
|
*
|
|
29
29
|
* @default true
|
|
30
|
-
|
|
30
|
+
|
|
31
31
|
*/
|
|
32
32
|
enabled?: boolean;
|
|
33
33
|
|
|
@@ -37,7 +37,7 @@ export interface DropDownListModel extends DropDownBaseModel{
|
|
|
37
37
|
* 1. value
|
|
38
38
|
*
|
|
39
39
|
* @default false
|
|
40
|
-
|
|
40
|
+
|
|
41
41
|
*/
|
|
42
42
|
enablePersistence?: boolean;
|
|
43
43
|
|
|
@@ -93,7 +93,7 @@ export interface DropDownListModel extends DropDownBaseModel{
|
|
|
93
93
|
* {% codeBlock src='dropdownlist/query/index.md' %}{% endcodeBlock %}
|
|
94
94
|
*
|
|
95
95
|
* @default null
|
|
96
|
-
|
|
96
|
+
|
|
97
97
|
*/
|
|
98
98
|
query?: Query;
|
|
99
99
|
|
|
@@ -104,7 +104,6 @@ export declare class DropDownList extends DropDownBase implements IInput {
|
|
|
104
104
|
private isSecondClick;
|
|
105
105
|
protected isListSearched: boolean;
|
|
106
106
|
protected preventChange: boolean;
|
|
107
|
-
protected isAngular: boolean;
|
|
108
107
|
protected selectedElementID: string;
|
|
109
108
|
private preselectedIndex;
|
|
110
109
|
private isTouched;
|
|
@@ -127,7 +126,7 @@ export declare class DropDownList extends DropDownBase implements IInput {
|
|
|
127
126
|
* Specifies a value that indicates whether the component is enabled or not.
|
|
128
127
|
*
|
|
129
128
|
* @default true
|
|
130
|
-
|
|
129
|
+
|
|
131
130
|
*/
|
|
132
131
|
enabled: boolean;
|
|
133
132
|
/**
|
|
@@ -136,7 +135,7 @@ export declare class DropDownList extends DropDownBase implements IInput {
|
|
|
136
135
|
* 1. value
|
|
137
136
|
*
|
|
138
137
|
* @default false
|
|
139
|
-
|
|
138
|
+
|
|
140
139
|
*/
|
|
141
140
|
enablePersistence: boolean;
|
|
142
141
|
/**
|
|
@@ -188,7 +187,7 @@ export declare class DropDownList extends DropDownBase implements IInput {
|
|
|
188
187
|
* {% codeBlock src='dropdownlist/query/index.md' %}{% endcodeBlock %}
|
|
189
188
|
*
|
|
190
189
|
* @default null
|
|
191
|
-
|
|
190
|
+
|
|
192
191
|
*/
|
|
193
192
|
query: Query;
|
|
194
193
|
/**
|
|
@@ -391,6 +390,13 @@ export declare class DropDownList extends DropDownBase implements IInput {
|
|
|
391
390
|
protected getElementByText(text: string): Element;
|
|
392
391
|
protected getElementByValue(value: string | number | boolean | object): Element;
|
|
393
392
|
private initValue;
|
|
393
|
+
/**
|
|
394
|
+
* Checks if the given value is disabled.
|
|
395
|
+
*
|
|
396
|
+
* @param { string | number | boolean | object } value - The value to check for disablement. Can be a string, number, boolean, or object.
|
|
397
|
+
* @returns { boolean } A boolean indicating whether the value is disabled.
|
|
398
|
+
*/
|
|
399
|
+
protected isDisableItemValue(value: string | number | boolean | object): boolean;
|
|
394
400
|
protected updateValues(): void;
|
|
395
401
|
protected onBlurHandler(e: MouseEvent): void;
|
|
396
402
|
protected focusOutAction(e?: MouseEvent | KeyboardEventArgs): void;
|
|
@@ -498,7 +504,7 @@ export declare class DropDownList extends DropDownBase implements IInput {
|
|
|
498
504
|
* @param {Query} query - Specify the query to filter the data.
|
|
499
505
|
* @param {FieldSettingsModel} fields - Specify the fields to map the column in the data table.
|
|
500
506
|
* @returns {void}
|
|
501
|
-
|
|
507
|
+
|
|
502
508
|
*/
|
|
503
509
|
filter(dataSource: {
|
|
504
510
|
[key: string]: Object;
|
|
@@ -620,6 +626,14 @@ export declare class DropDownList extends DropDownBase implements IInput {
|
|
|
620
626
|
* @returns {void}
|
|
621
627
|
*/
|
|
622
628
|
focusOut(e?: MouseEvent | KeyboardEventArgs): void;
|
|
629
|
+
/**
|
|
630
|
+
* Method to disable specific item in the popup.
|
|
631
|
+
*
|
|
632
|
+
* @param {string | number | object | HTMLLIElement} item - Specifies the item to be disabled.
|
|
633
|
+
* @returns {void}
|
|
634
|
+
|
|
635
|
+
*/
|
|
636
|
+
disableItem(item: string | number | object | HTMLLIElement): void;
|
|
623
637
|
/**
|
|
624
638
|
* Removes the component from the DOM and detaches all its related event handlers. Also it removes the attributes and classes.
|
|
625
639
|
*
|
|
@@ -88,7 +88,6 @@ var DropDownList = /** @class */ (function (_super) {
|
|
|
88
88
|
var _this = _super.call(this, options, element) || this;
|
|
89
89
|
_this.isListSearched = false;
|
|
90
90
|
_this.preventChange = false;
|
|
91
|
-
_this.isAngular = false;
|
|
92
91
|
_this.isTouched = false;
|
|
93
92
|
_this.IsScrollerAtEnd = function () {
|
|
94
93
|
return this.list && this.list.scrollTop + this.list.clientHeight >= this.list.scrollHeight;
|
|
@@ -213,7 +212,7 @@ var DropDownList = /** @class */ (function (_super) {
|
|
|
213
212
|
this.removeFocus();
|
|
214
213
|
this.list.scrollTop = 0;
|
|
215
214
|
if (this.getModuleName() !== 'autocomplete' && !isNullOrUndefined(this.ulElement)) {
|
|
216
|
-
var li = this.ulElement.querySelector('.' + dropDownListClasses.li);
|
|
215
|
+
var li = this.fields.disabled ? this.ulElement.querySelector('.' + dropDownListClasses.li + ':not(.e-disabled)') : this.ulElement.querySelector('.' + dropDownListClasses.li);
|
|
217
216
|
if (this.enableVirtualization) {
|
|
218
217
|
li = this.liCollections[this.skeletonCount];
|
|
219
218
|
}
|
|
@@ -418,7 +417,32 @@ var DropDownList = /** @class */ (function (_super) {
|
|
|
418
417
|
this.updateValues();
|
|
419
418
|
}
|
|
420
419
|
};
|
|
420
|
+
/**
|
|
421
|
+
* Checks if the given value is disabled.
|
|
422
|
+
*
|
|
423
|
+
* @param { string | number | boolean | object } value - The value to check for disablement. Can be a string, number, boolean, or object.
|
|
424
|
+
* @returns { boolean } A boolean indicating whether the value is disabled.
|
|
425
|
+
*/
|
|
426
|
+
DropDownList.prototype.isDisableItemValue = function (value) {
|
|
427
|
+
if (typeof (value) === 'object') {
|
|
428
|
+
var objectValue = JSON.parse(JSON.stringify(value))[this.fields.value];
|
|
429
|
+
return this.isDisabledItemByIndex(this.getIndexByValue(objectValue));
|
|
430
|
+
}
|
|
431
|
+
return this.isDisabledItemByIndex(this.getIndexByValue(value));
|
|
432
|
+
};
|
|
421
433
|
DropDownList.prototype.updateValues = function () {
|
|
434
|
+
if (this.fields.disabled) {
|
|
435
|
+
if (this.value != null) {
|
|
436
|
+
this.value = !this.isDisableItemValue(this.value) ? this.value : null;
|
|
437
|
+
}
|
|
438
|
+
if (this.text != null) {
|
|
439
|
+
this.text = !this.isDisabledItemByIndex(this.getIndexByValue(this.getValueByText(this.text))) ? this.text : null;
|
|
440
|
+
}
|
|
441
|
+
if (this.index != null) {
|
|
442
|
+
this.index = !this.isDisabledItemByIndex(this.index) ? this.index : null;
|
|
443
|
+
this.activeIndex = this.index;
|
|
444
|
+
}
|
|
445
|
+
}
|
|
422
446
|
this.selectedValueInfo = this.viewPortInfo;
|
|
423
447
|
if (!isNullOrUndefined(this.value)) {
|
|
424
448
|
var value = this.allowObjectBinding && !isNullOrUndefined(this.value) ? getValue(((this.fields.value) ? this.fields.value : ''), this.value) : this.value;
|
|
@@ -611,7 +635,7 @@ var DropDownList = /** @class */ (function (_super) {
|
|
|
611
635
|
var target = e.target;
|
|
612
636
|
this.keyboardEvent = null;
|
|
613
637
|
var li = closest(target, '.' + dropDownBaseClasses.li);
|
|
614
|
-
if (!this.isValidLI(li)) {
|
|
638
|
+
if (!this.isValidLI(li) || this.isDisabledElement(li)) {
|
|
615
639
|
return;
|
|
616
640
|
}
|
|
617
641
|
this.setSelection(li, e);
|
|
@@ -755,7 +779,14 @@ var DropDownList = /** @class */ (function (_super) {
|
|
|
755
779
|
}
|
|
756
780
|
}
|
|
757
781
|
else {
|
|
758
|
-
var li =
|
|
782
|
+
var li = void 0;
|
|
783
|
+
if (this.fields.disabled) {
|
|
784
|
+
var enableLiCollections = this.list.querySelectorAll('.' + dropDownBaseClasses.li + ':not(.e-disabled)');
|
|
785
|
+
li = incrementalSearch(e.charCode, enableLiCollections, this.activeIndex, true, this.element.id);
|
|
786
|
+
}
|
|
787
|
+
else {
|
|
788
|
+
li = incrementalSearch(e.charCode, this.liCollections, this.activeIndex, true, this.element.id);
|
|
789
|
+
}
|
|
759
790
|
if (!isNullOrUndefined(li)) {
|
|
760
791
|
this.setSelection(li, e);
|
|
761
792
|
this.setScrollPosition();
|
|
@@ -885,6 +916,9 @@ var DropDownList = /** @class */ (function (_super) {
|
|
|
885
916
|
}
|
|
886
917
|
};
|
|
887
918
|
DropDownList.prototype.updateUpDownAction = function (e, isVirtualKeyAction) {
|
|
919
|
+
if (this.fields.disabled && this.list && this.list.querySelectorAll('.e-list-item:not(.e-disabled)').length === 0) {
|
|
920
|
+
return;
|
|
921
|
+
}
|
|
888
922
|
if (this.allowFiltering && !this.enableVirtualization && this.getModuleName() !== 'autocomplete') {
|
|
889
923
|
var value_1 = this.getItemData().value;
|
|
890
924
|
if (isNullOrUndefined(value_1)) {
|
|
@@ -995,6 +1029,25 @@ var DropDownList = /** @class */ (function (_super) {
|
|
|
995
1029
|
attributes(this.filterInput, { 'aria-activedescendant': this.ulElement.getElementsByClassName('e-active')[0].id });
|
|
996
1030
|
}
|
|
997
1031
|
}
|
|
1032
|
+
var itemIndex;
|
|
1033
|
+
for (var index = 0; index < this.liCollections.length; index++) {
|
|
1034
|
+
if (this.liCollections[index].classList.contains(dropDownListClasses.focus)
|
|
1035
|
+
|| this.liCollections[index].classList.contains(dropDownListClasses.selected)) {
|
|
1036
|
+
itemIndex = index;
|
|
1037
|
+
break;
|
|
1038
|
+
}
|
|
1039
|
+
}
|
|
1040
|
+
if (itemIndex != null && this.isDisabledElement(this.liCollections[itemIndex])) {
|
|
1041
|
+
if (this.getModuleName() !== 'autocomplete') {
|
|
1042
|
+
if (this.liCollections.length - 1 === itemIndex && e.action === 'down') {
|
|
1043
|
+
e.action = 'up';
|
|
1044
|
+
}
|
|
1045
|
+
if (itemIndex === 0 && e.action === 'up') {
|
|
1046
|
+
e.action = 'down';
|
|
1047
|
+
}
|
|
1048
|
+
}
|
|
1049
|
+
this.updateUpDownAction(e);
|
|
1050
|
+
}
|
|
998
1051
|
e.preventDefault();
|
|
999
1052
|
};
|
|
1000
1053
|
DropDownList.prototype.updateHomeEndAction = function (e, isVirtualKeyAction) {
|
|
@@ -1095,6 +1148,9 @@ var DropDownList = /** @class */ (function (_super) {
|
|
|
1095
1148
|
DropDownList.prototype.selectCurrentItem = function (e) {
|
|
1096
1149
|
if (this.isPopupOpen) {
|
|
1097
1150
|
var li = this.list.querySelector('.' + dropDownListClasses.focus);
|
|
1151
|
+
if (this.isDisabledElement(li)) {
|
|
1152
|
+
return;
|
|
1153
|
+
}
|
|
1098
1154
|
if (li) {
|
|
1099
1155
|
this.setSelection(li, e);
|
|
1100
1156
|
this.isTyped = false;
|
|
@@ -1864,7 +1920,7 @@ var DropDownList = /** @class */ (function (_super) {
|
|
|
1864
1920
|
* @param {Query} query - Specify the query to filter the data.
|
|
1865
1921
|
* @param {FieldSettingsModel} fields - Specify the fields to map the column in the data table.
|
|
1866
1922
|
* @returns {void}
|
|
1867
|
-
|
|
1923
|
+
|
|
1868
1924
|
*/
|
|
1869
1925
|
DropDownList.prototype.filter = function (dataSource, query, fields) {
|
|
1870
1926
|
this.isCustomFilter = true;
|
|
@@ -3356,6 +3412,10 @@ var DropDownList = /** @class */ (function (_super) {
|
|
|
3356
3412
|
this_1.setEnable();
|
|
3357
3413
|
break;
|
|
3358
3414
|
case 'text':
|
|
3415
|
+
if (this_1.fields.disabled) {
|
|
3416
|
+
newProp.text = newProp.text && !this_1.isDisabledItemByIndex(this_1.getIndexByValue(this_1.getValueByText(newProp.text)))
|
|
3417
|
+
? newProp.text : null;
|
|
3418
|
+
}
|
|
3359
3419
|
if (newProp.text === null) {
|
|
3360
3420
|
this_1.clearAll();
|
|
3361
3421
|
break;
|
|
@@ -3407,6 +3467,9 @@ var DropDownList = /** @class */ (function (_super) {
|
|
|
3407
3467
|
}
|
|
3408
3468
|
break;
|
|
3409
3469
|
case 'value':
|
|
3470
|
+
if (this_1.fields.disabled) {
|
|
3471
|
+
newProp.value = newProp.value != null && !this_1.isDisableItemValue(newProp.value) ? newProp.value : null;
|
|
3472
|
+
}
|
|
3410
3473
|
if (newProp.value === null) {
|
|
3411
3474
|
this_1.clearAll();
|
|
3412
3475
|
break;
|
|
@@ -3466,6 +3529,9 @@ var DropDownList = /** @class */ (function (_super) {
|
|
|
3466
3529
|
}
|
|
3467
3530
|
break;
|
|
3468
3531
|
case 'index':
|
|
3532
|
+
if (this_1.fields.disabled) {
|
|
3533
|
+
newProp.index = newProp.index != null && !this_1.isDisabledItemByIndex(newProp.index) ? newProp.index : null;
|
|
3534
|
+
}
|
|
3469
3535
|
if (newProp.index === null) {
|
|
3470
3536
|
this_1.clearAll();
|
|
3471
3537
|
break;
|
|
@@ -3783,6 +3849,65 @@ var DropDownList = /** @class */ (function (_super) {
|
|
|
3783
3849
|
Input.calculateWidth(this.inputElement, this.inputWrapper.container);
|
|
3784
3850
|
}
|
|
3785
3851
|
};
|
|
3852
|
+
/**
|
|
3853
|
+
* Method to disable specific item in the popup.
|
|
3854
|
+
*
|
|
3855
|
+
* @param {string | number | object | HTMLLIElement} item - Specifies the item to be disabled.
|
|
3856
|
+
* @returns {void}
|
|
3857
|
+
|
|
3858
|
+
*/
|
|
3859
|
+
DropDownList.prototype.disableItem = function (item) {
|
|
3860
|
+
if (this.fields.disabled) {
|
|
3861
|
+
if (!this.list) {
|
|
3862
|
+
this.renderList();
|
|
3863
|
+
}
|
|
3864
|
+
var itemIndex = -1;
|
|
3865
|
+
if (this.liCollections && this.liCollections.length > 0 && this.listData && this.fields.disabled) {
|
|
3866
|
+
if (typeof (item) === 'string') {
|
|
3867
|
+
itemIndex = this.getIndexByValue(item);
|
|
3868
|
+
}
|
|
3869
|
+
else if (typeof item === 'object') {
|
|
3870
|
+
if (item instanceof HTMLLIElement) {
|
|
3871
|
+
for (var index = 0; index < this.liCollections.length; index++) {
|
|
3872
|
+
if (this.liCollections[index] === item) {
|
|
3873
|
+
itemIndex = this.getIndexByValue(item.getAttribute('data-value'));
|
|
3874
|
+
break;
|
|
3875
|
+
}
|
|
3876
|
+
}
|
|
3877
|
+
}
|
|
3878
|
+
else {
|
|
3879
|
+
var value = JSON.parse(JSON.stringify(item))[this.fields.value];
|
|
3880
|
+
for (var index = 0; index < this.listData.length; index++) {
|
|
3881
|
+
if (JSON.parse(JSON.stringify(this.listData[index]))[this.fields.value] === value) {
|
|
3882
|
+
itemIndex = this.getIndexByValue(value);
|
|
3883
|
+
break;
|
|
3884
|
+
}
|
|
3885
|
+
}
|
|
3886
|
+
}
|
|
3887
|
+
}
|
|
3888
|
+
else {
|
|
3889
|
+
itemIndex = item;
|
|
3890
|
+
}
|
|
3891
|
+
var isValidIndex = itemIndex < this.liCollections.length && itemIndex > -1;
|
|
3892
|
+
if (isValidIndex && !(JSON.parse(JSON.stringify(this.listData[itemIndex]))[this.fields.disabled])) {
|
|
3893
|
+
var li = this.liCollections[itemIndex];
|
|
3894
|
+
if (li) {
|
|
3895
|
+
this.disableListItem(li);
|
|
3896
|
+
var parsedData = JSON.parse(JSON.stringify(this.listData[itemIndex]));
|
|
3897
|
+
parsedData[this.fields.disabled] = true;
|
|
3898
|
+
this.listData[itemIndex] = parsedData;
|
|
3899
|
+
this.dataSource = this.listData;
|
|
3900
|
+
if (li.classList.contains(dropDownListClasses.focus)) {
|
|
3901
|
+
this.removeFocus();
|
|
3902
|
+
}
|
|
3903
|
+
if (li.classList.contains(dropDownListClasses.selected)) {
|
|
3904
|
+
this.clear();
|
|
3905
|
+
}
|
|
3906
|
+
}
|
|
3907
|
+
}
|
|
3908
|
+
}
|
|
3909
|
+
}
|
|
3910
|
+
};
|
|
3786
3911
|
/**
|
|
3787
3912
|
* Removes the component from the DOM and detaches all its related event handlers. Also it removes the attributes and classes.
|
|
3788
3913
|
*
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Input, InputObject, FloatLabelType, TextBox, InputEventArgs } from '@syncfusion/ej2-inputs';import { createCheckBox } from '@syncfusion/ej2-buttons';import { NotifyPropertyChanges, INotifyPropertyChanged, Property, Event, EmitType, SanitizeHtmlHelper } from '@syncfusion/ej2-base';import { Component, EventHandler, attributes, formatUnit, ChildProperty, remove, L10n, extend } from '@syncfusion/ej2-base';import { addClass, removeClass, detach, prepend, Complex, closest, setValue, getValue, compile, append } from '@syncfusion/ej2-base';import { select, selectAll, isNullOrUndefined as isNOU, matches, Browser, KeyboardEvents, KeyboardEventArgs } from '@syncfusion/ej2-base';import { DataManager, Query, DataUtil } from '@syncfusion/ej2-data';import { Popup } from '@syncfusion/ej2-popups';import { TreeView, NodeSelectEventArgs, DataBoundEventArgs, FieldsSettingsModel, NodeClickEventArgs
|
|
1
|
+
import { Input, InputObject, FloatLabelType, TextBox, InputEventArgs } from '@syncfusion/ej2-inputs';import { createCheckBox } from '@syncfusion/ej2-buttons';import { NotifyPropertyChanges, INotifyPropertyChanged, Property, Event, EmitType, SanitizeHtmlHelper } from '@syncfusion/ej2-base';import { Component, EventHandler, attributes, formatUnit, ChildProperty, remove, L10n, extend } from '@syncfusion/ej2-base';import { addClass, removeClass, detach, prepend, Complex, closest, setValue, getValue, compile, append } from '@syncfusion/ej2-base';import { select, selectAll, isNullOrUndefined as isNOU, matches, Browser, KeyboardEvents, KeyboardEventArgs } from '@syncfusion/ej2-base';import { DataManager, Query, DataUtil } from '@syncfusion/ej2-data';import { Popup } from '@syncfusion/ej2-popups';import { TreeView, NodeSelectEventArgs, DataBoundEventArgs, FieldsSettingsModel, NodeClickEventArgs } from '@syncfusion/ej2-navigations';import { NodeCheckEventArgs, FailureEventArgs} from '@syncfusion/ej2-navigations';
|
|
2
2
|
import {Mode,ExpandOn,TreeFilterType,SortOrder,DdtBeforeOpenEventArgs,DdtChangeEventArgs,DdtPopupEventArgs,DdtDataBoundEventArgs,DdtFilteringEventArgs,DdtFocusEventArgs,DdtKeyPressEventArgs,DdtSelectEventArgs} from "./drop-down-tree";
|
|
3
3
|
import {ComponentModel} from '@syncfusion/ej2-base';
|
|
4
4
|
|
|
@@ -393,9 +393,9 @@ export interface DropDownTreeModel extends ComponentModel{
|
|
|
393
393
|
/**
|
|
394
394
|
* Specifies whether to destroy the popup or to maintain it in DOM when it is closed.
|
|
395
395
|
* When this property is set to false, then the popup will not be removed from DOM once it is closed.
|
|
396
|
-
*
|
|
396
|
+
*
|
|
397
397
|
* @default true
|
|
398
|
-
|
|
398
|
+
|
|
399
399
|
*/
|
|
400
400
|
destroyPopupOnHide?: boolean;
|
|
401
401
|
|
|
@@ -488,91 +488,91 @@ export interface DropDownTreeModel extends ComponentModel{
|
|
|
488
488
|
/**
|
|
489
489
|
* Triggers when the data fetch request from the remote server fails.
|
|
490
490
|
*
|
|
491
|
-
* @event
|
|
491
|
+
* @event actionFailure
|
|
492
492
|
*/
|
|
493
493
|
actionFailure?: EmitType<Object>;
|
|
494
494
|
|
|
495
495
|
/**
|
|
496
496
|
* Fires when popup opens before animation.
|
|
497
497
|
*
|
|
498
|
-
* @event
|
|
498
|
+
* @event beforeOpen
|
|
499
499
|
*/
|
|
500
500
|
beforeOpen?: EmitType<DdtBeforeOpenEventArgs>;
|
|
501
501
|
|
|
502
502
|
/**
|
|
503
503
|
* Triggers when an item in a popup is selected or when the model value is changed by user.
|
|
504
504
|
*
|
|
505
|
-
* @event
|
|
505
|
+
* @event change
|
|
506
506
|
*/
|
|
507
507
|
change?: EmitType<DdtChangeEventArgs>;
|
|
508
508
|
|
|
509
509
|
/**
|
|
510
510
|
* Fires when popup close after animation completion.
|
|
511
511
|
*
|
|
512
|
-
* @event
|
|
512
|
+
* @event close
|
|
513
513
|
*/
|
|
514
514
|
close?: EmitType<DdtPopupEventArgs>;
|
|
515
515
|
|
|
516
516
|
/**
|
|
517
517
|
* Triggers when the Dropdown Tree input element gets focus-out.
|
|
518
518
|
*
|
|
519
|
-
* @event
|
|
519
|
+
* @event blur
|
|
520
520
|
*/
|
|
521
521
|
blur?: EmitType<Object>;
|
|
522
522
|
|
|
523
523
|
/**
|
|
524
524
|
* Triggers when the Dropdown Tree is created successfully.
|
|
525
525
|
*
|
|
526
|
-
* @event
|
|
526
|
+
* @event created
|
|
527
527
|
*/
|
|
528
528
|
created?: EmitType<Object>;
|
|
529
529
|
|
|
530
530
|
/**
|
|
531
531
|
* Triggers when data source is populated in the Dropdown Tree.
|
|
532
532
|
*
|
|
533
|
-
* @event
|
|
533
|
+
* @event dataBound
|
|
534
534
|
*/
|
|
535
535
|
dataBound?: EmitType<DdtDataBoundEventArgs>;
|
|
536
536
|
|
|
537
537
|
/**
|
|
538
538
|
* Triggers when the Dropdown Tree is destroyed successfully.
|
|
539
539
|
*
|
|
540
|
-
* @event
|
|
540
|
+
* @event destroyed
|
|
541
541
|
*/
|
|
542
542
|
destroyed?: EmitType<Object>;
|
|
543
543
|
|
|
544
544
|
/**
|
|
545
545
|
* Triggers on typing a character in the filter bar when the **allowFiltering** is enabled.
|
|
546
546
|
*
|
|
547
|
-
* @event
|
|
547
|
+
* @event filtering
|
|
548
548
|
*/
|
|
549
549
|
filtering?: EmitType<DdtFilteringEventArgs>;
|
|
550
550
|
|
|
551
551
|
/**
|
|
552
552
|
* Triggers when the Dropdown Tree input element is focused.
|
|
553
553
|
*
|
|
554
|
-
* @event
|
|
554
|
+
* @event focus
|
|
555
555
|
*/
|
|
556
556
|
focus?: EmitType<DdtFocusEventArgs>;
|
|
557
557
|
|
|
558
558
|
/**
|
|
559
559
|
* Triggers when key press is successful. It helps to customize the operations at key press.
|
|
560
560
|
*
|
|
561
|
-
* @event
|
|
561
|
+
* @event keyPress
|
|
562
562
|
*/
|
|
563
563
|
keyPress?: EmitType<DdtKeyPressEventArgs>;
|
|
564
564
|
|
|
565
565
|
/**
|
|
566
566
|
* Fires when popup opens after animation completion.
|
|
567
567
|
*
|
|
568
|
-
* @event
|
|
568
|
+
* @event open
|
|
569
569
|
*/
|
|
570
570
|
open?: EmitType<DdtPopupEventArgs>;
|
|
571
571
|
|
|
572
572
|
/**
|
|
573
573
|
* Triggers when an item in the popup is selected by the user either with mouse/tap or with keyboard navigation.
|
|
574
574
|
*
|
|
575
|
-
* @event
|
|
575
|
+
* @event select
|
|
576
576
|
*/
|
|
577
577
|
select?: EmitType<DdtSelectEventArgs>;
|
|
578
578
|
|