@syncfusion/ej2-multicolumn-combobox 29.2.4 → 30.1.39
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 +2 -0
- package/dist/ej2-multicolumn-combobox.umd.min.js +2 -2
- package/dist/ej2-multicolumn-combobox.umd.min.js.map +1 -1
- package/dist/es6/ej2-multicolumn-combobox.es2015.js +91 -80
- package/dist/es6/ej2-multicolumn-combobox.es2015.js.map +1 -1
- package/dist/es6/ej2-multicolumn-combobox.es5.js +99 -98
- package/dist/es6/ej2-multicolumn-combobox.es5.js.map +1 -1
- package/dist/global/ej2-multicolumn-combobox.min.js +2 -2
- package/dist/global/ej2-multicolumn-combobox.min.js.map +1 -1
- package/dist/global/index.d.ts +1 -1
- package/package.json +14 -49
- package/src/multicolumn-combobox/multi-column-combo-box-model.d.ts +1 -1
- package/src/multicolumn-combobox/multi-column-combo-box.d.ts +9 -3
- package/src/multicolumn-combobox/multi-column-combo-box.js +99 -98
|
@@ -327,6 +327,9 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
327
327
|
};
|
|
328
328
|
MultiColumnComboBox.prototype.render = function () {
|
|
329
329
|
this.renderInput();
|
|
330
|
+
if (this.gridData == null) {
|
|
331
|
+
this.setGridData(this.dataSource);
|
|
332
|
+
}
|
|
330
333
|
this.renderGrid();
|
|
331
334
|
this.popupDiv = this.createElement('div', { className: CONTENT });
|
|
332
335
|
this.popupDiv.appendChild(this.gridEle);
|
|
@@ -334,6 +337,63 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
334
337
|
this.renderPopup();
|
|
335
338
|
this.wireEvents();
|
|
336
339
|
};
|
|
340
|
+
MultiColumnComboBox.prototype.setGridData = function (dataSource, query) {
|
|
341
|
+
var _this = this;
|
|
342
|
+
this.trigger('actionBegin', { cancel: false, query: query }, function (args) {
|
|
343
|
+
if (!args.cancel) {
|
|
344
|
+
if (dataSource instanceof DataManager) {
|
|
345
|
+
if (_this.isShowSpinner) {
|
|
346
|
+
_this.showHideSpinner(true);
|
|
347
|
+
}
|
|
348
|
+
dataSource.executeQuery(_this.getQuery(query)).then(function (e) {
|
|
349
|
+
_this.gridData = e.result;
|
|
350
|
+
_this.trigger('actionComplete', e, function (e) {
|
|
351
|
+
_this.showHideSpinner(false);
|
|
352
|
+
if (!_this.isMainDataUpdated) {
|
|
353
|
+
_this.mainData = _this.gridData;
|
|
354
|
+
_this.isMainDataUpdated = true;
|
|
355
|
+
}
|
|
356
|
+
if (_this.popupDiv) {
|
|
357
|
+
_this.updateGridDataSource();
|
|
358
|
+
}
|
|
359
|
+
});
|
|
360
|
+
}).catch(function (e) {
|
|
361
|
+
_this.trigger('actionFailure', e, null);
|
|
362
|
+
});
|
|
363
|
+
}
|
|
364
|
+
else {
|
|
365
|
+
var dataManager = new DataManager(dataSource);
|
|
366
|
+
var listItems = (_this.getQuery(query)).executeLocal(dataManager);
|
|
367
|
+
_this.gridData = listItems;
|
|
368
|
+
_this.trigger('actionComplete', { result: listItems }, function (e) {
|
|
369
|
+
if (!_this.isMainDataUpdated) {
|
|
370
|
+
_this.mainData = _this.gridData;
|
|
371
|
+
_this.isMainDataUpdated = true;
|
|
372
|
+
}
|
|
373
|
+
if (_this.popupDiv) {
|
|
374
|
+
_this.updateGridDataSource();
|
|
375
|
+
}
|
|
376
|
+
});
|
|
377
|
+
}
|
|
378
|
+
}
|
|
379
|
+
});
|
|
380
|
+
};
|
|
381
|
+
MultiColumnComboBox.prototype.getQuery = function (query) {
|
|
382
|
+
var filterQuery;
|
|
383
|
+
if (!this.isCustomFilter && this.allowFiltering) {
|
|
384
|
+
filterQuery = query ? query.clone() : this.query ? this.query.clone() : new Query();
|
|
385
|
+
var filterType = this.typedString === '' ? 'contains' : this.filterType;
|
|
386
|
+
if ((this.allowFiltering && this.typedString && this.typedString !== '')) {
|
|
387
|
+
var fields = (this.fields.text) ? this.fields.text : '';
|
|
388
|
+
filterQuery.where(fields, filterType, this.typedString, true, false);
|
|
389
|
+
}
|
|
390
|
+
}
|
|
391
|
+
else {
|
|
392
|
+
filterQuery = (this.customFilterQuery != null) ?
|
|
393
|
+
this.customFilterQuery.clone() : query ? query.clone() : this.query ? this.query.clone() : new Query();
|
|
394
|
+
}
|
|
395
|
+
return filterQuery;
|
|
396
|
+
};
|
|
337
397
|
MultiColumnComboBox.prototype.setHiddenValue = function () {
|
|
338
398
|
if (isNullOrUndefined(this.value)) {
|
|
339
399
|
this.hiddenElement.innerHTML = '';
|
|
@@ -357,7 +417,7 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
357
417
|
var gridColumns = this.getGridColumns();
|
|
358
418
|
var sortOrder = this.sortOrder.toString().toLowerCase();
|
|
359
419
|
this.gridObj = new Grid({
|
|
360
|
-
dataSource: this.
|
|
420
|
+
dataSource: this.gridData,
|
|
361
421
|
columns: gridColumns,
|
|
362
422
|
allowSorting: this.allowSorting,
|
|
363
423
|
enableStickyHeader: true,
|
|
@@ -367,7 +427,6 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
367
427
|
enableVirtualization: this.enableVirtualization,
|
|
368
428
|
enableRtl: this.enableRtl,
|
|
369
429
|
editSettings: { allowAdding: false },
|
|
370
|
-
query: this.query,
|
|
371
430
|
allowTextWrap: this.gridSettings.allowTextWrap,
|
|
372
431
|
textWrapSettings: { wrapMode: this.gridSettings.textWrapMode },
|
|
373
432
|
height: this.popupHeight,
|
|
@@ -382,7 +441,6 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
382
441
|
},
|
|
383
442
|
dataBound: function () { _this.onDataBound(); },
|
|
384
443
|
actionFailure: function (args) { _this.onActionFailure(args); },
|
|
385
|
-
actionBegin: function (args) { _this.trigger('actionBegin', args); },
|
|
386
444
|
actionComplete: this.handleActionComplete.bind(this),
|
|
387
445
|
keyPressed: this.handleKeyPressed.bind(this),
|
|
388
446
|
resizing: function (args) {
|
|
@@ -418,7 +476,6 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
418
476
|
};
|
|
419
477
|
MultiColumnComboBox.prototype.handleActionComplete = function (args) {
|
|
420
478
|
var _this = this;
|
|
421
|
-
this.trigger('actionComplete', args);
|
|
422
479
|
if (args.requestType === 'sorting') {
|
|
423
480
|
this.updateRowSelection(args);
|
|
424
481
|
}
|
|
@@ -543,6 +600,11 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
543
600
|
};
|
|
544
601
|
MultiColumnComboBox.prototype.onDataBound = function () {
|
|
545
602
|
var _this = this;
|
|
603
|
+
if (this.isLocaleChanged) {
|
|
604
|
+
this.isLocaleChanged = false;
|
|
605
|
+
this.unWireEvents();
|
|
606
|
+
this.wireEvents();
|
|
607
|
+
}
|
|
546
608
|
var dataCount = this.dataSource.length;
|
|
547
609
|
var popupChild = this.popupDiv.querySelector('.' + MULTICOLUMNGRID);
|
|
548
610
|
var hasNoDataClass = this.popupDiv.classList.contains(NODATA);
|
|
@@ -782,8 +844,8 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
782
844
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
783
845
|
var dataLists = e.result;
|
|
784
846
|
var filteredData = dataLists.filter(function (item) {
|
|
785
|
-
var fieldVal = _this.updateFieldValue(isRerender ? (isValue ? _this.fields.value :
|
|
786
|
-
!isNullOrUndefined(_this.value) ? _this.fields.value : _this.fields.text, item);
|
|
847
|
+
var fieldVal = item ? (_this.updateFieldValue(isRerender ? (isValue ? _this.fields.value :
|
|
848
|
+
_this.fields.text) : !isNullOrUndefined(_this.value) ? _this.fields.value : _this.fields.text, item)) : null;
|
|
787
849
|
return fieldVal === value_1;
|
|
788
850
|
});
|
|
789
851
|
if (filteredData.length > 0) {
|
|
@@ -1094,24 +1156,24 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
1094
1156
|
this.showPopup(null, true);
|
|
1095
1157
|
this.updateClearIconState();
|
|
1096
1158
|
if (this.allowFiltering) {
|
|
1097
|
-
|
|
1098
|
-
var customFiltering_1 = false;
|
|
1159
|
+
this.typedString = e.target.value.toLowerCase();
|
|
1099
1160
|
var eventArgs_1 = {
|
|
1100
1161
|
preventDefaultAction: false,
|
|
1101
|
-
text:
|
|
1162
|
+
text: this.typedString,
|
|
1102
1163
|
updateData: function (dataSource, query, fields) {
|
|
1103
1164
|
if (eventArgs_1.cancel) {
|
|
1104
1165
|
return;
|
|
1105
1166
|
}
|
|
1106
|
-
|
|
1107
|
-
_this.
|
|
1167
|
+
_this.isCustomFilter = true;
|
|
1168
|
+
_this.customFilterQuery = query ? query.clone() : query;
|
|
1169
|
+
_this.setGridData(dataSource, query);
|
|
1108
1170
|
},
|
|
1109
1171
|
event: e,
|
|
1110
1172
|
cancel: false
|
|
1111
1173
|
};
|
|
1112
1174
|
this.trigger('filtering', eventArgs_1, function (eventArgs) {
|
|
1113
|
-
if (!eventArgs.cancel && !eventArgs.preventDefaultAction && !
|
|
1114
|
-
_this.
|
|
1175
|
+
if (!eventArgs.cancel && !eventArgs.preventDefaultAction && !_this.isCustomFilter) {
|
|
1176
|
+
_this.setGridData(_this.dataSource, _this.query ? _this.query.clone() : null);
|
|
1115
1177
|
}
|
|
1116
1178
|
});
|
|
1117
1179
|
}
|
|
@@ -1119,27 +1181,16 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
1119
1181
|
};
|
|
1120
1182
|
MultiColumnComboBox.prototype.updateInputValue = function (inputValue) {
|
|
1121
1183
|
return __awaiter(this, void 0, void 0, function () {
|
|
1122
|
-
var _a, _b, data, exactData
|
|
1184
|
+
var _a, _b, data, exactData;
|
|
1123
1185
|
return __generator(this, function (_c) {
|
|
1124
|
-
|
|
1125
|
-
|
|
1126
|
-
|
|
1127
|
-
|
|
1128
|
-
|
|
1129
|
-
case 1:
|
|
1130
|
-
result = _c.sent();
|
|
1131
|
-
totaldata = result.result;
|
|
1132
|
-
(_a = this.filterDatas(totaldata, inputValue), data = _a.data, exactData = _a.exactData);
|
|
1133
|
-
return [3 /*break*/, 3];
|
|
1134
|
-
case 2:
|
|
1135
|
-
if (Array.isArray(this.dataSource)) {
|
|
1136
|
-
(_b = this.filterDatas(this.dataSource, inputValue), data = _b.data, exactData = _b.exactData);
|
|
1137
|
-
}
|
|
1138
|
-
_c.label = 3;
|
|
1139
|
-
case 3:
|
|
1140
|
-
this.selectFilteredRows(data, exactData);
|
|
1141
|
-
return [2 /*return*/];
|
|
1186
|
+
if (this.dataSource instanceof DataManager) {
|
|
1187
|
+
(_a = this.filterDatas(this.mainData, inputValue), data = _a.data, exactData = _a.exactData);
|
|
1188
|
+
}
|
|
1189
|
+
else if (Array.isArray(this.dataSource)) {
|
|
1190
|
+
(_b = this.filterDatas(this.dataSource, inputValue), data = _b.data, exactData = _b.exactData);
|
|
1142
1191
|
}
|
|
1192
|
+
this.selectFilteredRows(data, exactData);
|
|
1193
|
+
return [2 /*return*/];
|
|
1143
1194
|
});
|
|
1144
1195
|
});
|
|
1145
1196
|
};
|
|
@@ -1165,72 +1216,14 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
1165
1216
|
var selectedIndex = this.findIndex(this.gridObj.currentViewData, this.matchedContent);
|
|
1166
1217
|
this.matchedRowEle = this.gridObj.getRowByIndex(selectedIndex);
|
|
1167
1218
|
};
|
|
1168
|
-
|
|
1169
|
-
|
|
1170
|
-
var _this = this;
|
|
1171
|
-
var isQuery = query || new Query();
|
|
1172
|
-
var filterType = this.filterType.toString().toLowerCase();
|
|
1173
|
-
if (isNullOrUndefined(query) && isNullOrUndefined(fields)) {
|
|
1174
|
-
this.updateGridDataSource(dataSource);
|
|
1175
|
-
}
|
|
1176
|
-
else if (query) {
|
|
1177
|
-
if (dataSource instanceof DataManager) {
|
|
1178
|
-
this.filteringHandler(dataSource, inputValue, query, fields);
|
|
1179
|
-
}
|
|
1180
|
-
else {
|
|
1181
|
-
new DataManager(dataSource).executeQuery(query).then(function (e) {
|
|
1182
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
1183
|
-
var dataLists = e.result;
|
|
1184
|
-
_this.updateGridDataSource(dataLists);
|
|
1185
|
-
});
|
|
1186
|
-
}
|
|
1187
|
-
}
|
|
1188
|
-
else {
|
|
1189
|
-
if (dataSource instanceof DataManager) {
|
|
1190
|
-
this.filteringHandler(dataSource, inputValue, isQuery, fields);
|
|
1191
|
-
}
|
|
1192
|
-
else if (Array.isArray(dataSource)) {
|
|
1193
|
-
var filteredData = dataSource.filter(function (item) {
|
|
1194
|
-
return _this.filterData(item, filterType, inputValue, fields);
|
|
1195
|
-
});
|
|
1196
|
-
this.updateGridDataSource(filteredData);
|
|
1197
|
-
}
|
|
1198
|
-
}
|
|
1199
|
-
};
|
|
1200
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
1201
|
-
MultiColumnComboBox.prototype.filteringHandler = function (dataSource, inputValue, query, fields) {
|
|
1202
|
-
var _this = this;
|
|
1203
|
-
var filterType = this.filterType.toString().toLowerCase();
|
|
1204
|
-
var filteredData;
|
|
1205
|
-
dataSource.executeQuery(query).then(function (e) {
|
|
1206
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
1207
|
-
var dataLists = e.result;
|
|
1208
|
-
filteredData = dataLists.filter(function (item) { return _this.filterData(item, filterType, inputValue, fields); });
|
|
1209
|
-
_this.updateGridDataSource(filteredData);
|
|
1210
|
-
});
|
|
1211
|
-
};
|
|
1212
|
-
MultiColumnComboBox.prototype.filterData = function (item, filterType, inputValue, fields) {
|
|
1213
|
-
var dataValue = this.updateFieldValue(fields ? fields.text : this.fields.text, item);
|
|
1214
|
-
var itemValue = dataValue.toLowerCase();
|
|
1215
|
-
switch (filterType) {
|
|
1216
|
-
case 'startswith':
|
|
1217
|
-
return itemValue.startsWith(inputValue);
|
|
1218
|
-
case 'endswith':
|
|
1219
|
-
return itemValue.endsWith(inputValue);
|
|
1220
|
-
case 'contains':
|
|
1221
|
-
return itemValue.includes(inputValue);
|
|
1222
|
-
default:
|
|
1223
|
-
return false;
|
|
1224
|
-
}
|
|
1225
|
-
};
|
|
1226
|
-
MultiColumnComboBox.prototype.updateGridDataSource = function (dataSource) {
|
|
1227
|
-
if (dataSource.length > 0) {
|
|
1219
|
+
MultiColumnComboBox.prototype.updateGridDataSource = function () {
|
|
1220
|
+
if (this.gridData && this.gridData.length > 0) {
|
|
1228
1221
|
removeClass([this.popupDiv], [NODATA]);
|
|
1229
1222
|
var noRecordEle = this.popupDiv.querySelector('.e-no-records');
|
|
1230
1223
|
if (noRecordEle) {
|
|
1231
1224
|
this.popupDiv.removeChild(noRecordEle);
|
|
1232
1225
|
}
|
|
1233
|
-
this.gridObj.dataSource =
|
|
1226
|
+
this.gridObj.dataSource = this.gridData;
|
|
1234
1227
|
this.isDataFiltered = true;
|
|
1235
1228
|
}
|
|
1236
1229
|
else {
|
|
@@ -1519,7 +1512,7 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
1519
1512
|
if (this.gridObj) {
|
|
1520
1513
|
var dataLength_1;
|
|
1521
1514
|
this.isShowSpinner = true;
|
|
1522
|
-
this.
|
|
1515
|
+
this.setGridData(newDataSource);
|
|
1523
1516
|
var isRemoteData = oldDataSource instanceof DataManager;
|
|
1524
1517
|
if (isRemoteData) {
|
|
1525
1518
|
oldDataSource.executeQuery(new Query()).then(function (e) {
|
|
@@ -1648,11 +1641,17 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
1648
1641
|
}
|
|
1649
1642
|
_this.inputEle.removeAttribute('aria-owns');
|
|
1650
1643
|
_this.inputEle.removeAttribute('aria-activedescendant');
|
|
1644
|
+
_this.customFilterQuery = null;
|
|
1651
1645
|
}
|
|
1652
1646
|
});
|
|
1653
1647
|
setTimeout(function () {
|
|
1654
1648
|
if (_this.gridObj) {
|
|
1655
|
-
_this.gridObj.dataSource = _this.
|
|
1649
|
+
_this.gridObj.dataSource = _this.allowFiltering ? _this.mainData : _this.gridData;
|
|
1650
|
+
var noRecordEle = _this.popupDiv.querySelector('.e-no-records');
|
|
1651
|
+
if (noRecordEle) {
|
|
1652
|
+
_this.popupDiv.removeChild(noRecordEle);
|
|
1653
|
+
removeClass([_this.popupDiv], [NODATA]);
|
|
1654
|
+
}
|
|
1656
1655
|
_this.updateGridHeight(true, false);
|
|
1657
1656
|
}
|
|
1658
1657
|
}, 100);
|
|
@@ -1859,9 +1858,8 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
1859
1858
|
this.updateDynamicDataSource(newProp.dataSource, oldProp.dataSource);
|
|
1860
1859
|
break;
|
|
1861
1860
|
case 'query':
|
|
1862
|
-
|
|
1863
|
-
|
|
1864
|
-
}
|
|
1861
|
+
this.isMainDataUpdated = false;
|
|
1862
|
+
this.setGridData(this.dataSource);
|
|
1865
1863
|
break;
|
|
1866
1864
|
case 'gridSettings':
|
|
1867
1865
|
if (this.gridObj) {
|
|
@@ -1909,6 +1907,9 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
1909
1907
|
this.gridObj.columns = gridColumns;
|
|
1910
1908
|
}
|
|
1911
1909
|
break;
|
|
1910
|
+
case 'locale':
|
|
1911
|
+
this.isLocaleChanged = true;
|
|
1912
|
+
break;
|
|
1912
1913
|
}
|
|
1913
1914
|
}
|
|
1914
1915
|
};
|