1 <div class="modal-body">
2 <form [formGroup]="addNewUserForm">
3 <div class="modal-body">
4 <div class="new-users-details-modal">
5 <div class="new-users-main">
8 <div class="new-users-container">
9 <div class="form-group">
10 <div>*First Name</div>
11 <input class="form-control" formControlName="firstName" type="text"
12 [ngClass]="{ 'is-invalid': submitted && formValue.firstName.errors }" />
13 <div *ngIf="submitted && formValue.firstName.errors" class="invalid-feedback">
14 <div *ngIf="formValue.firstName.errors.required">
15 First Name is required
22 <div class="new-users-container">
23 <div class="form-group">
24 <div>Middle Name</div>
25 <input class="form-control" formControlName="middleInitial" type="text" />
30 <div class="new-users-container">
31 <div class="form-group">
33 <input class="form-control" formControlName="lastName" type="text"
34 [ngClass]="{ 'is-invalid': submitted && formValue.lastName.errors }" />
35 <div *ngIf="submitted && formValue.lastName.errors" class="invalid-feedback">
36 <div *ngIf="formValue.lastName.errors.required">
43 <!-- Email Address ID -->
44 <div class="new-users-container">
45 <div class="form-group">
46 <div>*Email Address ID</div>
47 <input class="form-control" formControlName="email" type="text"
48 [ngClass]="{ 'is-invalid': submitted && formValue.email.errors }" />
49 <div *ngIf="submitted && formValue.email.errors" class="invalid-feedback">
50 <div *ngIf="formValue.email.errors.required">
51 Email Address is required
53 <div *ngIf="formValue.email.errors.email">
54 Email Address is invalid
61 <div class="new-users-container">
62 <div class="form-group">
64 <input class="form-control" formControlName="loginId" type="text"
65 [ngClass]="{ 'is-invalid': submitted && formValue.loginId.errors }" />
66 <div *ngIf="submitted && formValue.loginId.errors" class="invalid-feedback">
67 <div *ngIf="formValue.loginId.errors.required">
74 <!-- Login Password -->
75 <div class="new-users-container">
76 <div class="form-group">
77 <div>*Login Password</div>
78 <input class="form-control" formControlName="loginPwd" type="password"
79 [ngClass]="{ 'is-invalid': submitted && formValue.loginPwd.errors }" />
80 <div *ngIf="submitted && formValue.loginPwd.errors" class="invalid-feedback">
81 <div *ngIf="formValue.loginPwd.errors.required">
84 <div *ngIf="formValue.loginPwd.errors.minlength">
85 Password must be at least 8 characters
91 <!-- Confirm Login Password -->
92 <div class="new-users-container">
93 <div class="form-group">
94 <div>*Confirm Password</div>
95 <input class="form-control" formControlName="confirmPassword" type="password"
96 [ngClass]="{ 'is-invalid': submitted && formValue.confirmPassword.errors }"
97 appEqualValidator="password" />
98 <div *ngIf="submitted && formValue.confirmPassword.errors" class="invalid-feedback">
99 <div *ngIf="formValue.confirmPassword.errors.required">
100 Confirm Login password
102 <div *ngIf="formValue.confirmPassword.errors.mustMatch">
115 <div class="modal-footer">
116 <button type="submit" class="btn btn-primary" (click)="addUser()" [disabled]="addNewUserForm.invalid">Next</button>
117 <button type="button" class="btn btn-primary" aria-label="Close" (click)="activeModal.dismiss('Cross')">Close</button>