Format date fields without patch form

src/app/loans/loans-view/loan-account-actions/create-guarantor/create-guarantor.component.html

@@ -23,7 +23,7 @@
             </mat-form-field>
 
             <mat-autocomplete autoActiveFirstOption #clientsAutocomplete="matAutocomplete" [displayWith]="displayClient"
-              (optionSelected)='clientSelected($event.option.value)'>
+              (optionSelected)="clientSelected($event.option.value)">
               <mat-option *ngFor="let client of clientsData" [value]="client">
                 {{ client.displayName }}
               </mat-option>
@@ -51,7 +51,7 @@
 
               <mat-form-field>
                 <mat-label>Amount</mat-label>
-                <input type="number" matInput required formControlName="amount" required>
+                <input type="number" matInput required formControlName="amount">
               </mat-form-field>
 
             </ng-container>
@@ -71,7 +71,7 @@
 
             <mat-form-field>
               <mat-label>First Name</mat-label>
-              <input matInput required formControlName="firstname" required>
+              <input matInput required formControlName="firstname">
               <mat-error *ngIf="newGuarantorForm.controls.firstname.hasError('required')">
                 First Name <strong>is required</strong>
               </mat-error>
@@ -79,7 +79,7 @@
 
             <mat-form-field>
               <mat-label>Last Name</mat-label>
-              <input matInput required formControlName="lastname" required>
+              <input matInput required formControlName="lastname">
               <mat-error *ngIf="newGuarantorForm.controls.lastname.hasError('required')">
                 Last Name <strong>is required</strong>
               </mat-error>

src/app/loans/loans-view/loan-account-actions/create-guarantor/create-guarantor.component.ts

@@ -149,28 +149,31 @@ export class CreateGuarantorComponent implements OnInit, AfterViewInit {
 
   /** Submits the new guarantor details form */
   submit() {
-    const prevdob: Date = this.newGuarantorForm.value.dob;
-    const guarantorTypeId: number = this.newGuarantorForm.value.existingClient ? this.dataObject.guarantorTypeOptions[0].id : this.dataObject.guarantorTypeOptions[2].id;
-    // TODO: Update once language and date settings are setup
+    const newGuarantorFormData = this.newGuarantorForm.value;
     const locale = this.settingsService.language.code;
     const dateFormat = this.settingsService.dateFormat;
-    const newGuarantorData = {
-      ... this.newGuarantorForm.value,
+
+    const prevdob: Date = this.newGuarantorForm.value.dob;
+    const guarantorTypeId: number = this.newGuarantorForm.value.existingClient ? this.dataObject.guarantorTypeOptions[0].id : this.dataObject.guarantorTypeOptions[2].id;
+    const data = {
+      ...newGuarantorFormData,
       locale,
+      dateFormat,
       guarantorTypeId
     };
 
     if (this.newGuarantorForm.value.existingClient) {
-      newGuarantorData['entityId'] = this.newGuarantorForm.controls.name.value.id;
+      data['entityId'] = this.newGuarantorForm.controls.name.value.id;
     } else {
-      newGuarantorData['dob'] = this.dateUtils.formatDate(prevdob, dateFormat),
-      newGuarantorData['dateFormat'] = dateFormat;
+      if (newGuarantorFormData.dob instanceof Date) {
+        data['dob'] = this.dateUtils.formatDate(prevdob, dateFormat);
+      }
     }
 
-    delete newGuarantorData.existingClient;
-    delete newGuarantorData.name;
+    delete data.existingClient;
+    delete data.name;
 
-    this.loanService.createNewGuarantor(this.loanId, newGuarantorData)
+    this.loanService.createNewGuarantor(this.loanId, data)
       .subscribe((response: any) => {
         this.router.navigate(['../../general'], { relativeTo: this.route });
       });