@syncfusion/ej2-multicolumn-combobox 30.1.37 → 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/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 +83 -80
- package/dist/es6/ej2-multicolumn-combobox.es2015.js.map +1 -1
- package/dist/es6/ej2-multicolumn-combobox.es5.js +91 -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 +3 -3
- package/src/multicolumn-combobox/multi-column-combo-box-model.d.ts +1 -1
- package/src/multicolumn-combobox/multi-column-combo-box.d.ts +8 -3
- package/src/multicolumn-combobox/multi-column-combo-box.js +91 -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
|
}
|
|
@@ -787,8 +844,8 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
787
844
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
788
845
|
var dataLists = e.result;
|
|
789
846
|
var filteredData = dataLists.filter(function (item) {
|
|
790
|
-
var fieldVal = _this.updateFieldValue(isRerender ? (isValue ? _this.fields.value :
|
|
791
|
-
!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;
|
|
792
849
|
return fieldVal === value_1;
|
|
793
850
|
});
|
|
794
851
|
if (filteredData.length > 0) {
|
|
@@ -1099,24 +1156,24 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
1099
1156
|
this.showPopup(null, true);
|
|
1100
1157
|
this.updateClearIconState();
|
|
1101
1158
|
if (this.allowFiltering) {
|
|
1102
|
-
|
|
1103
|
-
var customFiltering_1 = false;
|
|
1159
|
+
this.typedString = e.target.value.toLowerCase();
|
|
1104
1160
|
var eventArgs_1 = {
|
|
1105
1161
|
preventDefaultAction: false,
|
|
1106
|
-
text:
|
|
1162
|
+
text: this.typedString,
|
|
1107
1163
|
updateData: function (dataSource, query, fields) {
|
|
1108
1164
|
if (eventArgs_1.cancel) {
|
|
1109
1165
|
return;
|
|
1110
1166
|
}
|
|
1111
|
-
|
|
1112
|
-
_this.
|
|
1167
|
+
_this.isCustomFilter = true;
|
|
1168
|
+
_this.customFilterQuery = query ? query.clone() : query;
|
|
1169
|
+
_this.setGridData(dataSource, query);
|
|
1113
1170
|
},
|
|
1114
1171
|
event: e,
|
|
1115
1172
|
cancel: false
|
|
1116
1173
|
};
|
|
1117
1174
|
this.trigger('filtering', eventArgs_1, function (eventArgs) {
|
|
1118
|
-
if (!eventArgs.cancel && !eventArgs.preventDefaultAction && !
|
|
1119
|
-
_this.
|
|
1175
|
+
if (!eventArgs.cancel && !eventArgs.preventDefaultAction && !_this.isCustomFilter) {
|
|
1176
|
+
_this.setGridData(_this.dataSource, _this.query ? _this.query.clone() : null);
|
|
1120
1177
|
}
|
|
1121
1178
|
});
|
|
1122
1179
|
}
|
|
@@ -1124,27 +1181,16 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
1124
1181
|
};
|
|
1125
1182
|
MultiColumnComboBox.prototype.updateInputValue = function (inputValue) {
|
|
1126
1183
|
return __awaiter(this, void 0, void 0, function () {
|
|
1127
|
-
var _a, _b, data, exactData
|
|
1184
|
+
var _a, _b, data, exactData;
|
|
1128
1185
|
return __generator(this, function (_c) {
|
|
1129
|
-
|
|
1130
|
-
|
|
1131
|
-
|
|
1132
|
-
|
|
1133
|
-
|
|
1134
|
-
case 1:
|
|
1135
|
-
result = _c.sent();
|
|
1136
|
-
totaldata = result.result;
|
|
1137
|
-
(_a = this.filterDatas(totaldata, inputValue), data = _a.data, exactData = _a.exactData);
|
|
1138
|
-
return [3 /*break*/, 3];
|
|
1139
|
-
case 2:
|
|
1140
|
-
if (Array.isArray(this.dataSource)) {
|
|
1141
|
-
(_b = this.filterDatas(this.dataSource, inputValue), data = _b.data, exactData = _b.exactData);
|
|
1142
|
-
}
|
|
1143
|
-
_c.label = 3;
|
|
1144
|
-
case 3:
|
|
1145
|
-
this.selectFilteredRows(data, exactData);
|
|
1146
|
-
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);
|
|
1147
1191
|
}
|
|
1192
|
+
this.selectFilteredRows(data, exactData);
|
|
1193
|
+
return [2 /*return*/];
|
|
1148
1194
|
});
|
|
1149
1195
|
});
|
|
1150
1196
|
};
|
|
@@ -1170,72 +1216,14 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
1170
1216
|
var selectedIndex = this.findIndex(this.gridObj.currentViewData, this.matchedContent);
|
|
1171
1217
|
this.matchedRowEle = this.gridObj.getRowByIndex(selectedIndex);
|
|
1172
1218
|
};
|
|
1173
|
-
|
|
1174
|
-
|
|
1175
|
-
var _this = this;
|
|
1176
|
-
var isQuery = query || new Query();
|
|
1177
|
-
var filterType = this.filterType.toString().toLowerCase();
|
|
1178
|
-
if (isNullOrUndefined(query) && isNullOrUndefined(fields)) {
|
|
1179
|
-
this.updateGridDataSource(dataSource);
|
|
1180
|
-
}
|
|
1181
|
-
else if (query) {
|
|
1182
|
-
if (dataSource instanceof DataManager) {
|
|
1183
|
-
this.filteringHandler(dataSource, inputValue, query, fields);
|
|
1184
|
-
}
|
|
1185
|
-
else {
|
|
1186
|
-
new DataManager(dataSource).executeQuery(query).then(function (e) {
|
|
1187
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
1188
|
-
var dataLists = e.result;
|
|
1189
|
-
_this.updateGridDataSource(dataLists);
|
|
1190
|
-
});
|
|
1191
|
-
}
|
|
1192
|
-
}
|
|
1193
|
-
else {
|
|
1194
|
-
if (dataSource instanceof DataManager) {
|
|
1195
|
-
this.filteringHandler(dataSource, inputValue, isQuery, fields);
|
|
1196
|
-
}
|
|
1197
|
-
else if (Array.isArray(dataSource)) {
|
|
1198
|
-
var filteredData = dataSource.filter(function (item) {
|
|
1199
|
-
return _this.filterData(item, filterType, inputValue, fields);
|
|
1200
|
-
});
|
|
1201
|
-
this.updateGridDataSource(filteredData);
|
|
1202
|
-
}
|
|
1203
|
-
}
|
|
1204
|
-
};
|
|
1205
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
1206
|
-
MultiColumnComboBox.prototype.filteringHandler = function (dataSource, inputValue, query, fields) {
|
|
1207
|
-
var _this = this;
|
|
1208
|
-
var filterType = this.filterType.toString().toLowerCase();
|
|
1209
|
-
var filteredData;
|
|
1210
|
-
dataSource.executeQuery(query).then(function (e) {
|
|
1211
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
1212
|
-
var dataLists = e.result;
|
|
1213
|
-
filteredData = dataLists.filter(function (item) { return _this.filterData(item, filterType, inputValue, fields); });
|
|
1214
|
-
_this.updateGridDataSource(filteredData);
|
|
1215
|
-
});
|
|
1216
|
-
};
|
|
1217
|
-
MultiColumnComboBox.prototype.filterData = function (item, filterType, inputValue, fields) {
|
|
1218
|
-
var dataValue = this.updateFieldValue(fields ? fields.text : this.fields.text, item);
|
|
1219
|
-
var itemValue = dataValue.toLowerCase();
|
|
1220
|
-
switch (filterType) {
|
|
1221
|
-
case 'startswith':
|
|
1222
|
-
return itemValue.startsWith(inputValue);
|
|
1223
|
-
case 'endswith':
|
|
1224
|
-
return itemValue.endsWith(inputValue);
|
|
1225
|
-
case 'contains':
|
|
1226
|
-
return itemValue.includes(inputValue);
|
|
1227
|
-
default:
|
|
1228
|
-
return false;
|
|
1229
|
-
}
|
|
1230
|
-
};
|
|
1231
|
-
MultiColumnComboBox.prototype.updateGridDataSource = function (dataSource) {
|
|
1232
|
-
if (dataSource.length > 0) {
|
|
1219
|
+
MultiColumnComboBox.prototype.updateGridDataSource = function () {
|
|
1220
|
+
if (this.gridData && this.gridData.length > 0) {
|
|
1233
1221
|
removeClass([this.popupDiv], [NODATA]);
|
|
1234
1222
|
var noRecordEle = this.popupDiv.querySelector('.e-no-records');
|
|
1235
1223
|
if (noRecordEle) {
|
|
1236
1224
|
this.popupDiv.removeChild(noRecordEle);
|
|
1237
1225
|
}
|
|
1238
|
-
this.gridObj.dataSource =
|
|
1226
|
+
this.gridObj.dataSource = this.gridData;
|
|
1239
1227
|
this.isDataFiltered = true;
|
|
1240
1228
|
}
|
|
1241
1229
|
else {
|
|
@@ -1524,7 +1512,7 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
1524
1512
|
if (this.gridObj) {
|
|
1525
1513
|
var dataLength_1;
|
|
1526
1514
|
this.isShowSpinner = true;
|
|
1527
|
-
this.
|
|
1515
|
+
this.setGridData(newDataSource);
|
|
1528
1516
|
var isRemoteData = oldDataSource instanceof DataManager;
|
|
1529
1517
|
if (isRemoteData) {
|
|
1530
1518
|
oldDataSource.executeQuery(new Query()).then(function (e) {
|
|
@@ -1653,11 +1641,17 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
1653
1641
|
}
|
|
1654
1642
|
_this.inputEle.removeAttribute('aria-owns');
|
|
1655
1643
|
_this.inputEle.removeAttribute('aria-activedescendant');
|
|
1644
|
+
_this.customFilterQuery = null;
|
|
1656
1645
|
}
|
|
1657
1646
|
});
|
|
1658
1647
|
setTimeout(function () {
|
|
1659
1648
|
if (_this.gridObj) {
|
|
1660
|
-
_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
|
+
}
|
|
1661
1655
|
_this.updateGridHeight(true, false);
|
|
1662
1656
|
}
|
|
1663
1657
|
}, 100);
|
|
@@ -1864,9 +1858,8 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
1864
1858
|
this.updateDynamicDataSource(newProp.dataSource, oldProp.dataSource);
|
|
1865
1859
|
break;
|
|
1866
1860
|
case 'query':
|
|
1867
|
-
|
|
1868
|
-
|
|
1869
|
-
}
|
|
1861
|
+
this.isMainDataUpdated = false;
|
|
1862
|
+
this.setGridData(this.dataSource);
|
|
1870
1863
|
break;
|
|
1871
1864
|
case 'gridSettings':
|
|
1872
1865
|
if (this.gridObj) {
|