nosu
/
taskana
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

TSK-1315: Now uses (input) instead of (keypress) 

to catch pasting and deleting
This commit is contained in:
Tristan Eisermann 2020-07-27 12:28:45 +02:00 committed by Tristan2357
parent a2c5b22435
commit 04729b86f8
7 changed files with 36 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
web/src/app/administration/components/classification-details/classification-details.component.html
View File

@ -42,7 +42,7 @@
<input type="text" required maxlength="32" #key="ngModel" [disabled]="!isCreatingNewClassification"
class="form-control"
id="classification-key" placeholder="Key" [(ngModel)]="classification.key"
name="classification.key" (keypress)="validateKeypress(key, 32)">
name="classification.key" (input)="validateInputOverflow(key, 32)">
<div *ngIf="inputOverflowMap.get(key.name)" class="error">{{lengthError}}</div>
<taskana-shared-field-error-display [displayError]="key.invalid && key.dirty"
errorMessage="* Key is required">
@ -56,7 +56,7 @@
class="form-control"
id="classification-name" placeholder="Name"
[(ngModel)]="classification.name" name="classification.name"
(keypress)="validateKeypress(name, 255)">
(input)="validateInputOverflow(name, 255)">
<div *ngIf="inputOverflowMap.get(name.name)" class="error">{{lengthError}}</div>
<taskana-shared-field-error-display [displayError]="name.invalid && name.dirty"
errorMessage="* Name is required">
@ -135,7 +135,7 @@
<input type="text" maxlength="255" class="form-control"
id="classification-service-level" placeholder="Service Level"
[(ngModel)]="classification.serviceLevel" name="classification.serviceLevel"
#serviceLevel="ngModel" (keypress)="validateKeypress(serviceLevel, 255)">
#serviceLevel="ngModel" (input)="validateInputOverflow(serviceLevel, 255)">
<div *ngIf="inputOverflowMap.get(serviceLevel.name)" class="error">{{lengthError}}</div>
</div>
@ -148,7 +148,7 @@
placeholder="Application entry point"
[(ngModel)]="classification.applicationEntryPoint"
name="classification.applicationEntryPoint" #appEntryPoint="ngModel"
(keypress)="validateKeypress(appEntryPoint, 255)">
(input)="validateInputOverflow(appEntryPoint, 255)">
<div *ngIf="inputOverflowMap.get(appEntryPoint.name)" class="error">{{lengthError}}</div>
</div>
@ -159,7 +159,7 @@
id="classification-description" placeholder="Description"
[(ngModel)]="classification.description"
name="classification.description" #description="ngModel"
(keypress)="validateKeypress(description, 255)"></textarea>
(input)="validateInputOverflow(description, 255)"></textarea>
<div *ngIf="inputOverflowMap.get(description.name)" class="error">{{lengthError}}</div>
</div>
</div>
@ -177,7 +177,7 @@
id="classification-custom-{{i + 1}}" placeholder="{{customField.field}}"
[(ngModel)]="classification[getClassificationCustom(i + 1)]"
name="classification.custom{{i + 1}}" #custom="ngModel"
(keypress)="validateKeypress(custom, 255)">
(input)="validateInputOverflow(custom, 255)">
<div *ngIf="inputOverflowMap.get(custom.name)" class="error">{{lengthError}}</div>
</div>
</div>

4
web/src/app/administration/components/classification-details/classification-details.component.ts
View File

@ -52,7 +52,7 @@ export class ClassificationDetailsComponent implements OnInit, OnDestroy {
isCreatingNewClassification: boolean = false;
readonly lengthError = 'You have reached the maximum length for this field';
inputOverflowMap = new Map<string, boolean>();
validateKeypress: Function;
validateInputOverflow: Function;
@ViewChild('ClassificationForm', { static: false }) classificationForm: NgForm;
toggleValidationMap = new Map<string, boolean>();
@ -89,7 +89,7 @@ export class ClassificationDetailsComponent implements OnInit, OnDestroy {
this.formsValidatorService.inputOverflowObservable.pipe(takeUntil(this.destroy$)).subscribe((inputOverflowMap) => {
this.inputOverflowMap = inputOverflowMap;
});
this.validateKeypress = (inputFieldModel, maxLength) => {
this.validateInputOverflow = (inputFieldModel, maxLength) => {
this.formsValidatorService.validateInputOverflow(inputFieldModel, maxLength);
};
}

20
web/src/app/administration/components/workbasket-information/workbasket-information.component.html
View File

@ -37,7 +37,7 @@
<label for="wb-key" class="control-label">Key</label>
<input type="text" required maxlength="64" #key="ngModel" class="form-control" id="wb-key"
placeholder="Key"
[(ngModel)]="workbasket.key" name="workbasket.key" (keypress)="validateKeypress(key, 64)">
[(ngModel)]="workbasket.key" name="workbasket.key" (input)="validateInputOverflow(key, 64, $event)">
<div *ngIf="inputOverflowMap.get(key.name)" class="error">{{lengthError}}</div>
<taskana-shared-field-error-display [displayError]="!isFieldValid('workbasket.key')"
[validationTrigger]="this.toggleValidationMap.get('workbasket.key')"
@ -50,7 +50,7 @@
<label for="wb-name" class="control-label">Name</label>
<input type="text" required maxlength="255" #name="ngModel" class="form-control" id="wb-name"
placeholder="Name"
[(ngModel)]="workbasket.name" name="workbasket.name" (keypress)="validateKeypress(name, 255)">
[(ngModel)]="workbasket.name" name="workbasket.name" (input)="validateInputOverflow(name, 255)">
<div *ngIf="inputOverflowMap.get(name.name)" class="error">{{lengthError}}</div>
<taskana-shared-field-error-display [displayError]="!isFieldValid('workbasket.name')"
[validationTrigger]="this.toggleValidationMap.get('workbasket.name')"
@ -67,13 +67,13 @@
placeHolderMessage="* Owner is required"
[validationValue]="this.toggleValidationMap.get('workbasket.owner')"
[displayError]="!isFieldValid('workbasket.owner')"
width="100%" (keypress)="validateKeypress(owner, 128)">
width="100%" (input)="validateInputOverflow(owner, 128)">
<div *ngIf="inputOverflowMap.get(owner.name)" class="error">{{lengthError}}</div>
</taskana-shared-type-ahead>
<ng-template #ownerInput>
<input type="text" required maxlength="128" #owner="ngModel" class="form-control" id="wb-owner"
placeholder="Owner"
[(ngModel)]="workbasket.owner" name="workbasket.owner" (keypress)="validateKeypress(owner, 128)">
[(ngModel)]="workbasket.owner" name="workbasket.owner" (input)="validateInputOverflow(owner, 128)">
<div *ngIf="inputOverflowMap.get(owner.name)" class="error">{{lengthError}}</div>
<taskana-shared-field-error-display [displayError]="!isFieldValid('workbasket.owner')"
[validationTrigger]="this.toggleValidationMap.get('workbasket.owner')"
@ -119,7 +119,7 @@
<textarea #description="ngModel" maxlength="255" class="form-control" rows="7" id="wb-description"
placeholder="Description"
[(ngModel)]="workbasket.description" name="workbasket.description"
(keypress)="validateKeypress(description, 255)"></textarea>
(input)="validateInputOverflow(description, 255)"></textarea>
<div *ngIf="inputOverflowMap.get(description.name)" class="error">{{lengthError}}</div>
</div>
</div>
@ -130,7 +130,7 @@
<input type="text" class="form-control" id="wb-org-level-1" placeholder="OrgLevel 1"
[(ngModel)]="workbasket.orgLevel1"
name="workbasket.orgLevel1" maxlength="255" #orgLevel1="ngModel"
(keypress)="validateKeypress(orgLevel1, 255)">
(input)="validateInputOverflow(orgLevel1, 255)">
<div *ngIf="inputOverflowMap.get(orgLevel1.name)" class="error">{{lengthError}}</div>
</div>
<div class="form-group">
@ -138,7 +138,7 @@
<input type="text" class="form-control" id="wb-org-level-2" placeholder="OrgLevel 2"
[(ngModel)]="workbasket.orgLevel2"
name="workbasket.orgLevel2" maxlength="255" #orgLevel2="ngModel"
(keypress)="validateKeypress(orgLevel2, 255)">
(input)="validateInputOverflow(orgLevel2, 255)">
<div *ngIf="inputOverflowMap.get(orgLevel2.name)" class="error">{{lengthError}}</div>
</div>
<div class="form-group" style="padding-top: 18px;">
@ -146,7 +146,7 @@
<input type="text" class="form-control" id="wb-org-level-3" placeholder="OrgLevel 3"
[(ngModel)]="workbasket.orgLevel3"
name="workbasket.orgLevel3" maxlength="255" #orgLevel3="ngModel"
(keypress)="validateKeypress(orgLevel3, 255)">
(input)="validateInputOverflow(orgLevel3, 255)">
<div *ngIf="inputOverflowMap.get(orgLevel3.name)" class="error">{{lengthError}}</div>
</div>
<div class="form-group">
@ -154,7 +154,7 @@
<input type="text" class="form-control" id="wb-org-level-4" placeholder="OrgLevel 4"
[(ngModel)]="workbasket.orgLevel4"
name="workbasket.orgLevel4" maxlength="255" #orgLevel4="ngModel"
(keypress)="validateKeypress(orgLevel4, 255)">
(input)="validateInputOverflow(orgLevel4, 255)">
<div *ngIf="inputOverflowMap.get(orgLevel4.name)" class="error">{{lengthError}}</div>
</div>
<ng-container *ngFor="let customField of customFields$ | async; let index = index">
@ -164,7 +164,7 @@
[placeholder]="customField.field"
[(ngModel)]="workbasket[getWorkbasketCustomProperty(index + 1)]"
name="workbasket[{{getWorkbasketCustomProperty(index + 1)}}]" maxlength="255" #custom="ngModel"
(keypress)="validateKeypress(custom, 255)">
(input)="validateInputOverflow(custom, 255)">
<div *ngIf="inputOverflowMap.get(custom.name)" class="error">{{lengthError}}</div>
</div>
</ng-container>

4
web/src/app/administration/components/workbasket-information/workbasket-information.component.ts
View File

@ -50,7 +50,7 @@ export class WorkbasketInformationComponent implements OnInit, OnChanges, OnDest
readonly lengthError = 'You have reached the maximum length for this field';
inputOverflowMap = new Map<string, boolean>();
validateKeypress: Function;
validateInputOverflow: Function;
@Select(EngineConfigurationSelectors.workbasketsCustomisation)
workbasketsCustomisation$: Observable<WorkbasketsCustomisation>;
@ -88,7 +88,7 @@ export class WorkbasketInformationComponent implements OnInit, OnChanges, OnDest
this.formsValidatorService.inputOverflowObservable.pipe(takeUntil(this.destroy$)).subscribe((inputOverflowMap) => {
this.inputOverflowMap = inputOverflowMap;
});
this.validateKeypress = (inputFieldModel, maxLength) => {
this.validateInputOverflow = (inputFieldModel, maxLength) => {
this.formsValidatorService.validateInputOverflow(inputFieldModel, maxLength);
};
}

5
web/src/app/shared/services/forms-validator/forms-validator.service.ts
View File

@ -109,7 +109,8 @@ export class FormsValidatorService {
);
}
validateInputOverflow(inputFieldModel: NgModel, maxLength: Number): void {
validateInputOverflow(inputFieldModel: NgModel, maxLength: Number, event?: any): void {
console.log(event);
if (this.overflowErrorSubscriptionMap.has(inputFieldModel.name)) {
this.overflowErrorSubscriptionMap.get(inputFieldModel.name).unsubscribe();
}
@ -123,6 +124,8 @@ export class FormsValidatorService {
this.inputOverflow.next(this.inputOverflowInternalMap);
})
);
} else {
this.inputOverflowInternalMap.set(inputFieldModel.name, false);
}
}
}

20
web/src/app/workplace/components/taskdetails-general/general-fields.component.html
View File

@ -5,7 +5,7 @@
<div class="form-group col-xs-6 required">
<label for="task-name" class="control-label">Name</label>
<input type="text" class="form-control" id="task-name" placeholder="Name" [(ngModel)]="task.name"
name="task.name" maxlength="255" #name (keypress)="validateKeypress(name, 255)">
name="task.name" maxlength="255" #name (input)="validateInputOverflow(name, 255)">
<div *ngIf="inputOverflowMap.get(name.name)" class="error">{{lengthError}}</div>
<taskana-shared-field-error-display [displayError]="!isFieldValid('task.name')"
[validationTrigger]="this.toggleValidationMap.get('task.name')"
@ -17,7 +17,7 @@
<input type="text" class="form-control" id="task.primaryObjRef.company" required
placeholder="Company description"
[(ngModel)]="task.primaryObjRef.company" name="task.primaryObjRef.company" maxlength="32" #company
(keypress)="validateKeypress(company, 32)">
(input)="validateInputOverflow(company, 32)">
<div *ngIf="inputOverflowMap.get(company.name)" class="error">{{lengthError}}</div>
<taskana-shared-field-error-display [displayError]="!isFieldValid('task.primaryObjRef.company')"
[validationTrigger]="this.toggleValidationMap.get('task.primaryObjRef.company')"
@ -32,7 +32,7 @@
<input type="text" class="form-control" id="task.primaryObjRef.system" required
placeholder="System description"
[(ngModel)]="task.primaryObjRef.system" name="task.primaryObjRef.system" maxlength="32" #system
(keypress)="validateKeypress(system, 32)">
(input)="validateInputOverflow(system, 32)">
<div *ngIf="inputOverflowMap.get(system.name)" class="error">{{lengthError}}</div>
<taskana-shared-field-error-display [displayError]="!isFieldValid('task.primaryObjRef.system')"
[validationTrigger]="this.toggleValidationMap.get('task.primaryObjRef.system')"
@ -44,7 +44,7 @@
<input type="text" class="form-control" id="task.primaryObjRef.systemInstance" required
placeholder="System Instance description"
[(ngModel)]="task.primaryObjRef.systemInstance" name="task.primaryObjRef.systemInstance" maxlength="32"
#instance (keypress)="validateKeypress(instance, 32)">
#instance (input)="validateInputOverflow(instance, 32)">
<div *ngIf="inputOverflowMap.get(instance.name)" class="error">{{lengthError}}</div>
<taskana-shared-field-error-display [displayError]="!isFieldValid('task.primaryObjRef.systemInstance')"
[validationTrigger]="this.toggleValidationMap.get('task.primaryObjRef.systemInstance')"
@ -57,7 +57,7 @@
<label for="task.primaryObjRef.type" class="control-label">Reference type</label>
<input type="text" class="form-control" id="task.primaryObjRef.type" required placeholder="Reference type"
[(ngModel)]="task.primaryObjRef.type" name="task.primaryObjRef.type" maxlength="32" #type
(keypress)="validateKeypress(type, 32)">
(input)="validateInputOverflow(type, 32)">
<div *ngIf="inputOverflowMap.get(type.name)" class="error">{{lengthError}}</div>
<taskana-shared-field-error-display [displayError]="!isFieldValid('task.primaryObjRef.type')"
[validationTrigger]="this.toggleValidationMap.get('task.primaryObjRef.type')"
@ -68,7 +68,7 @@
<label for="task.primaryObjRef.value" class="control-label">Reference value</label>
<input type="text" class="form-control" id="task.primaryObjRef.value" required placeholder="Reference value"
[(ngModel)]="task.primaryObjRef.value" name="task.primaryObjRef.value" maxlength="32" #value
(keypress)="validateKeypress(value, 32)">
(input)="validateInputOverflow(value, 32)">
<div *ngIf="inputOverflowMap.get(value.name)" class="error">{{lengthError}}</div>
<taskana-shared-field-error-display [displayError]="!isFieldValid('task.primaryObjRef.value')"
[validationTrigger]="this.toggleValidationMap.get('task.primaryObjRef.value')"
@ -101,14 +101,14 @@
<input type="text" class="form-control" id="task-parent-business-p-id" placeholder="Parent business process iD"
[(ngModel)]="task.parentBusinessProcessId" name="task.parentBusinessProcessId" maxlength="128"
#parentBusinessProcessId
(keypress)="validateKeypress(parentBusinessProcessId, 128)">
(input)="validateInputOverflow(parentBusinessProcessId, 128)">
<div *ngIf="inputOverflowMap.get(parentBusinessProcessId.name)" class="error">{{lengthError}}</div>
</div>
<div class="form-group">
<label for="task-business-p-id" class="control-label">Business process iD</label>
<input type="text" class="form-control" id="task-business-p-id" placeholder="Business process id"
[(ngModel)]="task.businessProcessId" name="task.businessProcessId" maxlength="128" #businessProcessId
(keypress)="validateKeypress(businessProcessId, 128)">
(input)="validateInputOverflow(businessProcessId, 128)">
<div *ngIf="inputOverflowMap.get(businessProcessId.name)" class="error">{{lengthError}}</div>
</div>
<div class="input-group form-group col-xs-12">
@ -120,7 +120,7 @@
<ng-template #ownerInput>
<input type="text" #owner="ngModel" class="form-control" id="ts-owner" placeholder="Owner"
[(ngModel)]="task.owner" name="task.owner" maxlength="32"
(keypress)="validateKeypress(owner, 32)">
(input)="validateInputOverflow(owner, 32)">
<div *ngIf="inputOverflowMap.get(owner.name)" class="error">{{lengthError}}</div>
</ng-template>
</div>
@ -130,7 +130,7 @@
<label for="task-note" class="control-label">Note</label>
<textarea class="form-control" rows="2" id="task-note" placeholder="Note" [(ngModel)]="task.note"
name="task.note" maxlength="4096" #note
(keypress)="validateKeypress(note, 4096)"></textarea>
(input)="validateInputOverflow(note, 4096)"></textarea>
<div *ngIf="inputOverflowMap.get(note.name)" class="error">{{lengthError}}</div>
</div>
</div>

4
web/src/app/workplace/components/taskdetails-general/general-fields.component.ts
View File

@ -47,7 +47,7 @@ export class TaskdetailsGeneralFieldsComponent implements OnInit, OnChanges, OnD
readonly lengthError = 'You have reached the maximum length';
inputOverflowMap = new Map<string, boolean>();
validateKeypress: Function;
validateInputOverflow: Function;
@Select(EngineConfigurationSelectors.tasksCustomisation) tasksCustomisation$: Observable<TasksCustomisation>;
private destroy$ = new Subject<void>();
@ -63,7 +63,7 @@ export class TaskdetailsGeneralFieldsComponent implements OnInit, OnChanges, OnD
this.formsValidatorService.inputOverflowObservable.pipe(takeUntil(this.destroy$)).subscribe((inputOverflowMap) => {
this.inputOverflowMap = inputOverflowMap;
});
this.validateKeypress = (inputFieldModel, maxLength) => {
this.validateInputOverflow = (inputFieldModel, maxLength) => {
this.formsValidatorService.validateInputOverflow(inputFieldModel, maxLength);
};
}