@syncfusion/ej2-form-renderer 34.2.2 → 34.2.4
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-form-renderer.umd.min.js +2 -2
- package/dist/ej2-form-renderer.umd.min.js.map +1 -1
- package/dist/es6/ej2-form-renderer.es2015.js +35 -2
- package/dist/es6/ej2-form-renderer.es2015.js.map +1 -1
- package/dist/es6/ej2-form-renderer.es5.js +89 -50
- package/dist/es6/ej2-form-renderer.es5.js.map +1 -1
- package/dist/global/ej2-form-renderer.min.js +2 -2
- package/dist/global/ej2-form-renderer.min.js.map +1 -1
- package/dist/global/index.d.ts +1 -1
- package/package.json +6 -6
- package/src/common/checkbox-group.js +2 -2
- package/src/form-renderer/form-renderer.js +87 -48
|
@@ -1947,7 +1947,7 @@ var CheckboxGroup = /** @__PURE__ @class */ (function () {
|
|
|
1947
1947
|
var optionLabel = typeof option === 'string'
|
|
1948
1948
|
? option
|
|
1949
1949
|
: (option.label != null ? option.label : (option.value != null ? option.value : String(optionValue)));
|
|
1950
|
-
var wrapper = document.createElement('
|
|
1950
|
+
var wrapper = document.createElement('input');
|
|
1951
1951
|
itemsContainer.appendChild(wrapper);
|
|
1952
1952
|
var checkBox = new CheckBox({
|
|
1953
1953
|
label: optionLabel,
|
|
@@ -2045,7 +2045,7 @@ var CheckboxGroup = /** @__PURE__ @class */ (function () {
|
|
|
2045
2045
|
var optionLabel = typeof option === 'string'
|
|
2046
2046
|
? option
|
|
2047
2047
|
: (option.label || option.value || String(optionValue));
|
|
2048
|
-
var wrapper = document.createElement('
|
|
2048
|
+
var wrapper = document.createElement('input');
|
|
2049
2049
|
_this.itemsContainer.appendChild(wrapper);
|
|
2050
2050
|
var checkBox = new CheckBox({
|
|
2051
2051
|
label: optionLabel,
|
|
@@ -5021,6 +5021,11 @@ var FormRenderer = /** @__PURE__ @class */ (function (_super) {
|
|
|
5021
5021
|
var rteInstance = getComponent(toolbarElement, 'toolbar');
|
|
5022
5022
|
rteInstance.refresh();
|
|
5023
5023
|
}
|
|
5024
|
+
if (component.type === 'tabs') {
|
|
5025
|
+
var tabElement = rendered.querySelector('.e-control.e-tab');
|
|
5026
|
+
var tabInstance = getComponent(tabElement, 'tab');
|
|
5027
|
+
tabInstance.refreshOverflow();
|
|
5028
|
+
}
|
|
5024
5029
|
});
|
|
5025
5030
|
if (this.created && !this.createdFired) {
|
|
5026
5031
|
setTimeout(function () {
|
|
@@ -6068,6 +6073,9 @@ var FormRenderer = /** @__PURE__ @class */ (function (_super) {
|
|
|
6068
6073
|
form.querySelectorAll('input[type="checkbox"]').forEach(function (cb) {
|
|
6069
6074
|
(cb.ej2_instances[0]).checked = false;
|
|
6070
6075
|
});
|
|
6076
|
+
form.querySelectorAll('.e-control.e-multiselect.e-lib').forEach(function (cb) {
|
|
6077
|
+
(cb.ej2_instances[0]).value = [];
|
|
6078
|
+
});
|
|
6071
6079
|
}
|
|
6072
6080
|
_this.formState.values = {};
|
|
6073
6081
|
form.reset();
|
|
@@ -6269,8 +6277,7 @@ var FormRenderer = /** @__PURE__ @class */ (function (_super) {
|
|
|
6269
6277
|
// Per-consumer dependency set (rebuilt each pass).
|
|
6270
6278
|
var consumerDeps = new Map();
|
|
6271
6279
|
var allComps = this.collectAllComponents(this.processedSchemaCache.components);
|
|
6272
|
-
|
|
6273
|
-
var comp = allComps_1[_i];
|
|
6280
|
+
var _loop_3 = function (comp) {
|
|
6274
6281
|
var myDeps = new Set();
|
|
6275
6282
|
consumerDeps.set(comp.id, myDeps);
|
|
6276
6283
|
var conditions = comp.conditions;
|
|
@@ -6284,34 +6291,34 @@ var FormRenderer = /** @__PURE__ @class */ (function (_super) {
|
|
|
6284
6291
|
'choiceBasedField',
|
|
6285
6292
|
'conditionalData'
|
|
6286
6293
|
];
|
|
6287
|
-
for (var
|
|
6288
|
-
var key = conditionKeys_1[
|
|
6294
|
+
for (var _i = 0, conditionKeys_1 = conditionKeys; _i < conditionKeys_1.length; _i++) {
|
|
6295
|
+
var key = conditionKeys_1[_i];
|
|
6289
6296
|
if (conditions[key]) {
|
|
6290
|
-
|
|
6291
|
-
|
|
6297
|
+
this_1.collectConditionFieldIds(conditions[key], triggers);
|
|
6298
|
+
this_1.collectConditionFieldIds(conditions[key], myDeps);
|
|
6292
6299
|
}
|
|
6293
6300
|
}
|
|
6294
6301
|
if (Array.isArray(conditions.conditionalData)) {
|
|
6295
|
-
for (var
|
|
6296
|
-
var item =
|
|
6302
|
+
for (var _a = 0, _b = conditions.conditionalData; _a < _b.length; _a++) {
|
|
6303
|
+
var item = _b[_a];
|
|
6297
6304
|
if (item && item.condition) {
|
|
6298
|
-
|
|
6299
|
-
|
|
6305
|
+
this_1.collectConditionFieldIds(item.condition, triggers);
|
|
6306
|
+
this_1.collectConditionFieldIds(item.condition, myDeps);
|
|
6300
6307
|
}
|
|
6301
6308
|
// DataGrid conditional columns
|
|
6302
6309
|
if (item && Array.isArray(item.conditions)) {
|
|
6303
|
-
for (var
|
|
6304
|
-
var subCond =
|
|
6305
|
-
|
|
6306
|
-
|
|
6310
|
+
for (var _c = 0, _d = item.conditions; _c < _d.length; _c++) {
|
|
6311
|
+
var subCond = _d[_c];
|
|
6312
|
+
this_1.collectConditionFieldIds(subCond, triggers);
|
|
6313
|
+
this_1.collectConditionFieldIds(subCond, myDeps);
|
|
6307
6314
|
}
|
|
6308
6315
|
}
|
|
6309
6316
|
}
|
|
6310
6317
|
}
|
|
6311
6318
|
if (conditions.setValueWhen &&
|
|
6312
6319
|
conditions.setValueWhen.condition) {
|
|
6313
|
-
|
|
6314
|
-
|
|
6320
|
+
this_1.collectConditionFieldIds(conditions.setValueWhen.condition, triggers);
|
|
6321
|
+
this_1.collectConditionFieldIds(conditions.setValueWhen.condition, myDeps);
|
|
6315
6322
|
}
|
|
6316
6323
|
if (conditions.choiceBasedField &&
|
|
6317
6324
|
typeof conditions.choiceBasedField.primaryFieldId === 'string') {
|
|
@@ -6319,6 +6326,33 @@ var FormRenderer = /** @__PURE__ @class */ (function (_super) {
|
|
|
6319
6326
|
myDeps.add(conditions.choiceBasedField.primaryFieldId);
|
|
6320
6327
|
}
|
|
6321
6328
|
}
|
|
6329
|
+
var collectMinMaxReferenceIds = function (range) {
|
|
6330
|
+
if (!range || range.enabled !== true) {
|
|
6331
|
+
return;
|
|
6332
|
+
}
|
|
6333
|
+
var collectFromBound = function (bound) {
|
|
6334
|
+
if (bound && typeof bound === 'object' && typeof bound.field === 'string') {
|
|
6335
|
+
triggers.add(bound.field);
|
|
6336
|
+
myDeps.add(bound.field);
|
|
6337
|
+
}
|
|
6338
|
+
};
|
|
6339
|
+
collectFromBound(range.minValue);
|
|
6340
|
+
collectFromBound(range.maxValue);
|
|
6341
|
+
};
|
|
6342
|
+
var minMaxRule = comp.minMaxRange;
|
|
6343
|
+
if (Array.isArray(minMaxRule)) {
|
|
6344
|
+
for (var _e = 0, minMaxRule_1 = minMaxRule; _e < minMaxRule_1.length; _e++) {
|
|
6345
|
+
var range = minMaxRule_1[_e];
|
|
6346
|
+
collectMinMaxReferenceIds(range);
|
|
6347
|
+
}
|
|
6348
|
+
}
|
|
6349
|
+
var minMaxTimeRule = comp.minMaxTimeRange;
|
|
6350
|
+
if (Array.isArray(minMaxTimeRule)) {
|
|
6351
|
+
for (var _f = 0, minMaxTimeRule_1 = minMaxTimeRule; _f < minMaxTimeRule_1.length; _f++) {
|
|
6352
|
+
var range = minMaxTimeRule_1[_f];
|
|
6353
|
+
collectMinMaxReferenceIds(range);
|
|
6354
|
+
}
|
|
6355
|
+
}
|
|
6322
6356
|
// ==========================================================
|
|
6323
6357
|
// DataGrid remote datasource dependencies
|
|
6324
6358
|
// Example:
|
|
@@ -6331,19 +6365,24 @@ var FormRenderer = /** @__PURE__ @class */ (function (_super) {
|
|
|
6331
6365
|
ds &&
|
|
6332
6366
|
ds.type === 'url') {
|
|
6333
6367
|
if (ds.search && typeof ds.search.key === 'string') {
|
|
6334
|
-
|
|
6335
|
-
|
|
6368
|
+
this_1.collectDataSourceReferenceIds(ds.search.key, allComps, triggers);
|
|
6369
|
+
this_1.collectDataSourceReferenceIds(ds.search.key, allComps, myDeps);
|
|
6336
6370
|
}
|
|
6337
6371
|
if (Array.isArray(ds.filters)) {
|
|
6338
|
-
for (var
|
|
6339
|
-
var filter = _g
|
|
6372
|
+
for (var _g = 0, _h = ds.filters; _g < _h.length; _g++) {
|
|
6373
|
+
var filter = _h[_g];
|
|
6340
6374
|
if (typeof filter.value === 'string') {
|
|
6341
|
-
|
|
6342
|
-
|
|
6375
|
+
this_1.collectDataSourceReferenceIds(filter.value, allComps, triggers);
|
|
6376
|
+
this_1.collectDataSourceReferenceIds(filter.value, allComps, myDeps);
|
|
6343
6377
|
}
|
|
6344
6378
|
}
|
|
6345
6379
|
}
|
|
6346
6380
|
}
|
|
6381
|
+
};
|
|
6382
|
+
var this_1 = this;
|
|
6383
|
+
for (var _i = 0, allComps_1 = allComps; _i < allComps_1.length; _i++) {
|
|
6384
|
+
var comp = allComps_1[_i];
|
|
6385
|
+
_loop_3(comp);
|
|
6347
6386
|
}
|
|
6348
6387
|
this.conditionalTriggerFieldIds = triggers;
|
|
6349
6388
|
this.consumerDependencyMap = consumerDeps;
|
|
@@ -6393,11 +6432,11 @@ var FormRenderer = /** @__PURE__ @class */ (function (_super) {
|
|
|
6393
6432
|
var savedWindowScrollY = window.scrollY;
|
|
6394
6433
|
this.preservedFields.clear();
|
|
6395
6434
|
var allComps = this.collectAllComponents(this.processedSchemaCache.components);
|
|
6396
|
-
var
|
|
6435
|
+
var _loop_4 = function (comp) {
|
|
6397
6436
|
if (!FormRenderer_1.PRESERVABLE_TYPES.has(comp.type)) {
|
|
6398
6437
|
return "continue";
|
|
6399
6438
|
}
|
|
6400
|
-
var myDeps =
|
|
6439
|
+
var myDeps = this_2.consumerDependencyMap.get(comp.id);
|
|
6401
6440
|
var dependsOnChanged = false;
|
|
6402
6441
|
if (myDeps) {
|
|
6403
6442
|
changedIds.forEach(function (changedId) {
|
|
@@ -6409,16 +6448,16 @@ var FormRenderer = /** @__PURE__ @class */ (function (_super) {
|
|
|
6409
6448
|
if (dependsOnChanged) {
|
|
6410
6449
|
return "continue";
|
|
6411
6450
|
}
|
|
6412
|
-
var liveNode =
|
|
6451
|
+
var liveNode = this_2.element.querySelector("[data-field-id=\"" + comp.id + "\"]");
|
|
6413
6452
|
if (liveNode && liveNode.parentElement) {
|
|
6414
6453
|
liveNode.parentElement.removeChild(liveNode);
|
|
6415
|
-
|
|
6454
|
+
this_2.preservedFields.set(comp.id, liveNode);
|
|
6416
6455
|
}
|
|
6417
6456
|
};
|
|
6418
|
-
var
|
|
6457
|
+
var this_2 = this;
|
|
6419
6458
|
for (var _i = 0, allComps_2 = allComps; _i < allComps_2.length; _i++) {
|
|
6420
6459
|
var comp = allComps_2[_i];
|
|
6421
|
-
|
|
6460
|
+
_loop_4(comp);
|
|
6422
6461
|
}
|
|
6423
6462
|
this.refreshing = true;
|
|
6424
6463
|
this.destroyRenderedExcludingPreserved();
|
|
@@ -6530,37 +6569,37 @@ var FormRenderer = /** @__PURE__ @class */ (function (_super) {
|
|
|
6530
6569
|
FormRenderer.prototype.destroyRenderedExcludingPreserved = function () {
|
|
6531
6570
|
var survived = [];
|
|
6532
6571
|
var preservedNodes = Array.from(this.preservedFields.values());
|
|
6533
|
-
var
|
|
6572
|
+
var _loop_5 = function (inst) {
|
|
6534
6573
|
var hostEl = inst && (inst.element || inst.target || (inst.hostElement && inst.hostElement()));
|
|
6535
6574
|
var isPreserved = !!hostEl && preservedNodes.some(function (n) { return n === hostEl || n.contains(hostEl); });
|
|
6536
6575
|
if (isPreserved) {
|
|
6537
6576
|
survived.push(inst);
|
|
6538
6577
|
}
|
|
6539
6578
|
else {
|
|
6540
|
-
|
|
6579
|
+
this_3.destroyRenderedInstance(inst);
|
|
6541
6580
|
}
|
|
6542
6581
|
};
|
|
6543
|
-
var
|
|
6582
|
+
var this_3 = this;
|
|
6544
6583
|
for (var _i = 0, _a = this.renderedInstances; _i < _a.length; _i++) {
|
|
6545
6584
|
var inst = _a[_i];
|
|
6546
|
-
|
|
6585
|
+
_loop_5(inst);
|
|
6547
6586
|
}
|
|
6548
6587
|
this.renderedInstances = survived;
|
|
6549
6588
|
// Prune inputRefs whose host element lives in a destroyed subtree
|
|
6550
6589
|
// (preserved ones stay).
|
|
6551
6590
|
var inputRefKeys = Object.keys(this.inputRefs);
|
|
6552
|
-
var
|
|
6553
|
-
var inst =
|
|
6591
|
+
var _loop_6 = function (key) {
|
|
6592
|
+
var inst = this_4.inputRefs[key];
|
|
6554
6593
|
var hostEl = inst && (inst.element || inst.target || (inst.hostElement && inst.hostElement()));
|
|
6555
6594
|
var isPreserved = !!hostEl && preservedNodes.some(function (n) { return n === hostEl || n.contains(hostEl); });
|
|
6556
6595
|
if (!isPreserved) {
|
|
6557
|
-
delete
|
|
6596
|
+
delete this_4.inputRefs[key];
|
|
6558
6597
|
}
|
|
6559
6598
|
};
|
|
6560
|
-
var
|
|
6599
|
+
var this_4 = this;
|
|
6561
6600
|
for (var _b = 0, inputRefKeys_1 = inputRefKeys; _b < inputRefKeys_1.length; _b++) {
|
|
6562
6601
|
var key = inputRefKeys_1[_b];
|
|
6563
|
-
|
|
6602
|
+
_loop_6(key);
|
|
6564
6603
|
}
|
|
6565
6604
|
this.conditionalValueApplied = {};
|
|
6566
6605
|
this.expressionDependencyGraph = {};
|
|
@@ -6641,7 +6680,7 @@ var FormRenderer = /** @__PURE__ @class */ (function (_super) {
|
|
|
6641
6680
|
Object.assign(previousValues, contextValues);
|
|
6642
6681
|
var changedFields = new Set();
|
|
6643
6682
|
var ctxKeys = Object.keys(contextValues);
|
|
6644
|
-
var
|
|
6683
|
+
var _loop_7 = function (fieldName) {
|
|
6645
6684
|
var fieldId = Object.keys(idToNameMap_1).find(function (id) { return idToNameMap_1[id] === fieldName; });
|
|
6646
6685
|
if (fieldId && contextValues[fieldName] !== previousContextValues[fieldName] && !computedFieldNames.has(fieldId)) {
|
|
6647
6686
|
changedFields.add(fieldName);
|
|
@@ -6649,13 +6688,13 @@ var FormRenderer = /** @__PURE__ @class */ (function (_super) {
|
|
|
6649
6688
|
};
|
|
6650
6689
|
for (var _a = 0, ctxKeys_1 = ctxKeys; _a < ctxKeys_1.length; _a++) {
|
|
6651
6690
|
var fieldName = ctxKeys_1[_a];
|
|
6652
|
-
|
|
6691
|
+
_loop_7(fieldName);
|
|
6653
6692
|
}
|
|
6654
6693
|
if (changedFields.size === 0) {
|
|
6655
6694
|
return;
|
|
6656
6695
|
}
|
|
6657
6696
|
var evaluationOrder = engine.getTopologicalOrder(dependencyGraph);
|
|
6658
|
-
var
|
|
6697
|
+
var _loop_8 = function (fieldName) {
|
|
6659
6698
|
var component = allComponents.find(function (c) { return c.name === fieldName; });
|
|
6660
6699
|
if (component && component.expressionValue) {
|
|
6661
6700
|
computedFieldNames.add(component.id);
|
|
@@ -6702,13 +6741,13 @@ var FormRenderer = /** @__PURE__ @class */ (function (_super) {
|
|
|
6702
6741
|
break;
|
|
6703
6742
|
}
|
|
6704
6743
|
}
|
|
6705
|
-
if (result !== null && result !== undefined && result !== formValues[component.id] &&
|
|
6706
|
-
|
|
6744
|
+
if (result !== null && result !== undefined && result !== formValues[component.id] && this_5.formState) {
|
|
6745
|
+
this_5.formState.values[component.id] = result;
|
|
6707
6746
|
// Sync the underlying input element so the
|
|
6708
6747
|
// FormValidator reads the new value on its
|
|
6709
6748
|
// next validate() pass.
|
|
6710
|
-
if (
|
|
6711
|
-
var inputEl =
|
|
6749
|
+
if (this_5.validator) {
|
|
6750
|
+
var inputEl = this_5.getInputElementByName(component.id);
|
|
6712
6751
|
if (inputEl) {
|
|
6713
6752
|
try {
|
|
6714
6753
|
if (inputEl.ej2_instances[0]) {
|
|
@@ -6726,18 +6765,18 @@ var FormRenderer = /** @__PURE__ @class */ (function (_super) {
|
|
|
6726
6765
|
}
|
|
6727
6766
|
}
|
|
6728
6767
|
catch (error) {
|
|
6729
|
-
if (
|
|
6730
|
-
|
|
6768
|
+
if (this_5.failure) {
|
|
6769
|
+
this_5.trigger('failure', {
|
|
6731
6770
|
error: error
|
|
6732
6771
|
});
|
|
6733
6772
|
}
|
|
6734
6773
|
}
|
|
6735
6774
|
}
|
|
6736
6775
|
};
|
|
6737
|
-
var
|
|
6776
|
+
var this_5 = this;
|
|
6738
6777
|
for (var _b = 0, evaluationOrder_1 = evaluationOrder; _b < evaluationOrder_1.length; _b++) {
|
|
6739
6778
|
var fieldName = evaluationOrder_1[_b];
|
|
6740
|
-
|
|
6779
|
+
_loop_8(fieldName);
|
|
6741
6780
|
}
|
|
6742
6781
|
Object.assign(previousValues, contextValues);
|
|
6743
6782
|
}
|