@esfaenza/forms-and-validations 11.2.61 → 11.2.64

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.
@@ -2798,6 +2798,10 @@
2798
2798
  * Mostra un testo a sinistra dell'input, **FormLayout** permettendo
2799
2799
  */
2800
2800
  this.Label = "";
2801
+ /**
2802
+ * Eventuali classi extra da applicare alla Label, di default c'è solo un leggero margin top
2803
+ */
2804
+ this.LabelClass = "m-t-5";
2801
2805
  /**
2802
2806
  * Utilizza o meno il Layout di un form (Label con input di fianco), se false mostra solo l'input
2803
2807
  */
@@ -2836,13 +2840,14 @@
2836
2840
  FormTemplateComponent.decorators = [
2837
2841
  { type: core.Component, args: [{
2838
2842
  selector: "form-template",
2839
- template: "<ng-container *ngIf=\"!FormLayout\">\r\n <ng-content></ng-content>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}<span *ngIf=\"Label\">:</span></label>\r\n <div class=\"col-md-{{InputColWidth}}\">\r\n <ng-content></ng-content>\r\n </div>\r\n <div class=\"clearfix\"></div>\r\n</div>",
2843
+ template: "<ng-container *ngIf=\"!FormLayout\">\r\n <ng-content></ng-content>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n <label class=\"col-md-{{LabelColWidth}} {{LabelClass}}\">{{Label}}{{Required ? '*' : ''}}<span *ngIf=\"Label\">:</span></label>\r\n <div class=\"col-md-{{InputColWidth}}\">\r\n <ng-content></ng-content>\r\n </div>\r\n <div class=\"clearfix\"></div>\r\n</div>",
2840
2844
  changeDetection: core.ChangeDetectionStrategy.OnPush
2841
2845
  },] }
2842
2846
  ];
2843
2847
  FormTemplateComponent.propDecorators = {
2844
2848
  Required: [{ type: core.Input }],
2845
2849
  Label: [{ type: core.Input }],
2850
+ LabelClass: [{ type: core.Input }],
2846
2851
  FormLayout: [{ type: core.Input }],
2847
2852
  LabelColWidth: [{ type: core.Input }],
2848
2853
  InputColWidth: [{ type: core.Input }],
@@ -3194,14 +3199,42 @@
3194
3199
  * Ovviamente lo faccio solo quando ho una SelectLabel, altrimenti non ho problemi di floattamenti
3195
3200
  */
3196
3201
  if (!this.SourceFirstBind && this.SelectLabel) {
3197
- this.BoundSource = null;
3198
- setTimeout(function () { _this.tryBindSourceDisplay(); _this.cdr.detectChanges(); });
3202
+ this.detatchPreviousAndRetatchNext(function (afterStuff) {
3203
+ _this.BoundSource = null;
3204
+ setTimeout(function () {
3205
+ _this.tryBindSourceDisplay();
3206
+ _this.cdr.detectChanges();
3207
+ setTimeout(function () { afterStuff(); });
3208
+ });
3209
+ });
3199
3210
  }
3200
3211
  else
3201
- this.tryBindSourceDisplay();
3212
+ this.detatchPreviousAndRetatchNext(function (afterStuff) {
3213
+ _this.tryBindSourceDisplay();
3214
+ _this.cdr.detectChanges();
3215
+ setTimeout(function () { afterStuff(); });
3216
+ });
3202
3217
  this.cdr.markForCheck();
3203
3218
  }
3204
3219
  };
3220
+ FormSelectComponent.prototype.detatchPreviousAndRetatchNext = function (doStuff) {
3221
+ var _this = this;
3222
+ if (this.validationControl)
3223
+ this.Form.removeControl(this.validationControl);
3224
+ else
3225
+ console.log("Nothing to detatch");
3226
+ setTimeout(function () {
3227
+ doStuff(function () {
3228
+ if (_this.validationControl)
3229
+ _this.Form.addControl(_this.validationControl);
3230
+ else if (_this.validationControl) {
3231
+ _this.Form.addControl(_this.validationControl);
3232
+ }
3233
+ else
3234
+ console.error("Impossibile aggiungere il componente di validaazione per " + _this.GeneratedName + ", le validazioni potrebbero funzionare in maniera erratica");
3235
+ });
3236
+ });
3237
+ };
3205
3238
  /**
3206
3239
  * @ignore
3207
3240
  */
@@ -3212,7 +3245,7 @@
3212
3245
  { type: core.Component, args: [{
3213
3246
  selector: "form-select",
3214
3247
  providers: [{ provide: localizations.LocalizationService, useClass: FormSelectComponentLoc }],
3215
- template: "<ng-container *ngIf=\"!FormLayout\">\r\n <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && BoundSource\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}:</label>\r\n <div class=\"col-md-{{InputColWidth}}\">\r\n <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n </div>\r\n <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<ng-template #controlTemplate>\r\n\r\n <!-- Select vuota per quando non ho Sorgenti dati da cui selezionare. Uguale identica alla piena ma senza option\r\n Purtroppo devono essere due componenti distinti perch\u00E9 una select una volta creata non riesce pi\u00F9 ad adattarsi ai cambi di options -->\r\n <val-select *ngIf=\"!BoundSource || BoundSource.length == 0\"\r\n [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\"\r\n [required]=\"Required ? 'required' : null\"\r\n [noValidate]=\"!Validation\"\r\n [readonly]=\"Readonly\"\r\n [forceInvalid]=\"ForcedError\"\r\n [label]=\"SelectLabel\"\r\n [validationFailed]=\"FailedValidationMessage\"\r\n [placeholder]=\"Required ? ((RequiredPlaceholder != null ? RequiredPlaceholder : ('Select' | localize : lc) + '...')) : Placeholder\"\r\n [placeHolderValue]=\"PlaceholderValue\"\r\n [submitted]=\"Form?.submitted\"\r\n [emptyFieldValue]=\"Required || Placeholder || SelectLabel ? EmptyFieldValue : ''\"\r\n [(ngModel)]=\"Model\"\r\n [showValidationSymbol]=\"ShowValidationSymbol\"\r\n [id]=\"GeneratedName\"\r\n name=\"{{GeneratedName}}\"\r\n (inputChange)=\"Model = $event == EmptyFieldValue ? (Required? PlaceholderValue : '') : $event; changed();\"\r\n (inputFocus)=\"focused($event);\"\r\n #validationControl=\"ngModel\">\r\n </val-select>\r\n\r\n <!-- Select vera e propria per quando arrivano i dati -->\r\n <val-select *ngIf=\"BoundSource && BoundSource.length > 0\"\r\n [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\"\r\n [required]=\"Required ? 'required' : null\"\r\n [noValidate]=\"!Validation\"\r\n [readonly]=\"Readonly\"\r\n [forceInvalid]=\"ForcedError\"\r\n [label]=\"SelectLabel\"\r\n [validationFailed]=\"FailedValidationMessage\"\r\n [showValidationSymbol]=\"ShowValidationSymbol\"\r\n [placeholder]=\"Required ? ((RequiredPlaceholder != null ? RequiredPlaceholder : ('Select' | localize : lc) + '...')) : Placeholder\"\r\n [placeHolderValue]=\"PlaceholderValue\"\r\n [submitted]=\"Form?.submitted\"\r\n [emptyFieldValue]=\"Required || Placeholder || SelectLabel ? EmptyFieldValue : ''\"\r\n [(ngModel)]=\"Model\"\r\n [id]=\"GeneratedName\"\r\n name=\"{{GeneratedName}}\"\r\n (inputChange)=\"Model = $event == EmptyFieldValue ? (Required? PlaceholderValue : '') : $event; changed();\"\r\n (inputFocus)=\"focused($event);\"\r\n (inputFinalized)=\"finalized()\"\r\n #validationControl=\"ngModel\">\r\n <option *ngFor=\"let obj of BoundSource\" [value]=\"obj.id\">{{obj.description}}</option>\r\n </val-select>\r\n</ng-template>",
3248
+ template: "<ng-container *ngIf=\"!FormLayout\">\r\n <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && BoundSource\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}:</label>\r\n <div class=\"col-md-{{InputColWidth}}\">\r\n <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n </div>\r\n <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<ng-template #controlTemplate>\r\n\r\n <!-- Select vuota per quando non ho Sorgenti dati da cui selezionare. Uguale identica alla piena ma senza option\r\n Purtroppo devono essere due componenti distinti perch\u00E9 una select una volta creata non riesce pi\u00F9 ad adattarsi ai cambi di options -->\r\n <val-select *ngIf=\"!BoundSource || BoundSource.length == 0\"\r\n [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\"\r\n [required]=\"Required ? 'required' : null\"\r\n [noValidate]=\"!Validation\"\r\n [readonly]=\"Readonly\"\r\n [forceInvalid]=\"ForcedError\"\r\n [label]=\"SelectLabel\"\r\n [validationFailed]=\"FailedValidationMessage\"\r\n [placeholder]=\"Required ? ((RequiredPlaceholder != null ? RequiredPlaceholder : ('Select' | localize : lc) + '...')) : Placeholder\"\r\n [placeHolderValue]=\"PlaceholderValue\"\r\n [submitted]=\"Form?.submitted\"\r\n [emptyFieldValue]=\"Required || Placeholder || SelectLabel ? EmptyFieldValue : ''\"\r\n [(ngModel)]=\"Model\"\r\n [showValidationSymbol]=\"ShowValidationSymbol\"\r\n [id]=\"GeneratedName\"\r\n name=\"{{GeneratedName}}_zero\"\r\n (inputChange)=\"Model = $event == EmptyFieldValue ? (Required? PlaceholderValue : '') : $event; changed();\"\r\n (inputFocus)=\"focused($event);\"\r\n #validationControl=\"ngModel\">\r\n </val-select>\r\n\r\n <!-- Select vera e propria per quando arrivano i dati -->\r\n <val-select *ngIf=\"BoundSource && BoundSource.length > 0\"\r\n [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\"\r\n [required]=\"Required ? 'required' : null\"\r\n [noValidate]=\"!Validation\"\r\n [readonly]=\"Readonly\"\r\n [forceInvalid]=\"ForcedError\"\r\n [label]=\"SelectLabel\"\r\n [validationFailed]=\"FailedValidationMessage\"\r\n [showValidationSymbol]=\"ShowValidationSymbol\"\r\n [placeholder]=\"Required ? ((RequiredPlaceholder != null ? RequiredPlaceholder : ('Select' | localize : lc) + '...')) : Placeholder\"\r\n [placeHolderValue]=\"PlaceholderValue\"\r\n [submitted]=\"Form?.submitted\"\r\n [emptyFieldValue]=\"Required || Placeholder || SelectLabel ? EmptyFieldValue : ''\"\r\n [(ngModel)]=\"Model\"\r\n [id]=\"GeneratedName\"\r\n name=\"{{GeneratedName}}_filled\"\r\n (inputChange)=\"Model = $event == EmptyFieldValue ? (Required? PlaceholderValue : '') : $event; changed();\"\r\n (inputFocus)=\"focused($event);\"\r\n (inputFinalized)=\"finalized()\"\r\n #validationControl=\"ngModel\">\r\n <option *ngFor=\"let obj of BoundSource\" [value]=\"obj.id\">{{obj.description}}</option>\r\n </val-select>\r\n</ng-template>",
3216
3249
  changeDetection: core.ChangeDetectionStrategy.OnPush
3217
3250
  },] }
3218
3251
  ];