diff --git a/src/app/masterdata-management/components/calendar/calendar.component.html b/src/app/masterdata-management/components/calendar/calendar.component.html
index 3de6d74..ddfa4c2 100644
--- a/src/app/masterdata-management/components/calendar/calendar.component.html
+++ b/src/app/masterdata-management/components/calendar/calendar.component.html
@@ -37,7 +37,7 @@
             </div>
             <div class="col-md-2">
               <div class="form-group">
-                <div class="input-group">
+                <div class="input-group" formGroupName="date">
                   <input class="form-control" placeholder="Datum" name="dp" ngbDatepicker #date="ngbDatepicker"
                     formControlName="date" id="dateInput" required>
                   <div class="input-group-append">
@@ -52,7 +52,7 @@
                     </button>
                   </div>
                 </div>
-                <ok-error [control]="form.controls['date']"></ok-error>
+                <ok-error [control]="form.controls['date'].controls['date']"></ok-error>
               </div>
             </div>
           </div>
diff --git a/src/app/masterdata-management/components/calendar/calendar.component.ts b/src/app/masterdata-management/components/calendar/calendar.component.ts
index 4628d10..a48f7f2 100644
--- a/src/app/masterdata-management/components/calendar/calendar.component.ts
+++ b/src/app/masterdata-management/components/calendar/calendar.component.ts
@@ -55,7 +55,9 @@
     this.form = this.fb.group({
       id: '',
       name: ['', Validators.required],
-      date: ['', Validators.required]
+      date: this.fb.group({
+        date: ['', Validators.required]
+      })
     });
   }
   /**
diff --git a/src/app/masterdata-management/components/standbygroup/standbygroup.component.ts b/src/app/masterdata-management/components/standbygroup/standbygroup.component.ts
index 15a801e..14a2d00 100644
--- a/src/app/masterdata-management/components/standbygroup/standbygroup.component.ts
+++ b/src/app/masterdata-management/components/standbygroup/standbygroup.component.ts
@@ -351,8 +351,10 @@
     if (dataToMove.length === 1) {
       this.userModalRef.componentInstance.form.patchValue(
         {
-          validFrom: this.ngbDateParserFormatter.parse(dataToMove[0].validFrom),
-          validTo: this.ngbDateParserFormatter.parse(dataToMove[0].validTo),
+          date: {
+            validFrom: this.ngbDateParserFormatter.parse(dataToMove[0].validFrom),
+            validTo: this.ngbDateParserFormatter.parse(dataToMove[0].validTo),
+          },
           position: dataToMove[0].position
         }
       );
diff --git a/src/app/masterdata-management/components/user/user.component.html b/src/app/masterdata-management/components/user/user.component.html
index 3450033..7590fda 100644
--- a/src/app/masterdata-management/components/user/user.component.html
+++ b/src/app/masterdata-management/components/user/user.component.html
@@ -11,7 +11,8 @@
 -->
 <div class="container-fluid">
   <form class="mt-3" [formGroup]="form" novalidate>
-    <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom stick-headlines" *ngIf="!isModal">
+    <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom stick-headlines"
+      *ngIf="!isModal">
       <h1 class="h2">Mitarbeiter verwalten</h1>
       <div class="btn-toolbar mb-2 mb-md-0">
         <button *ngIf="authService.userHasRoles(['BP_Sachbearbeiter','BP_Admin'])" class="btn btn-success mr-1" (click)="saveUser()"
@@ -47,7 +48,7 @@
           </div>
           <div class="row">
             <div [ngClass]="{'col-md-6': !isModal, 'col-md-12': isModal}">
-              <div class="row">
+              <div class="row" formGroupName="date">
                 <label class="form-check-label col-form-label col-md-3">
                   Gültigkeit
                 </label>
@@ -67,8 +68,9 @@
                           <i class="fa fa-clock-o" aria-hidden="true"></i>
                         </button>
                       </div>
+                      <ok-error [control]="form.controls['date'].controls['validFrom']" class="w-100"></ok-error>
                     </div>
-                    <ok-error [control]="form.controls['validTo']"></ok-error>
+                    <ok-error [control]="form.controls['date']"></ok-error>
                   </div>
                 </div>
                 <div class="col-md-4">
@@ -87,6 +89,7 @@
                           <i class="fa fa-clock-o" aria-hidden="true"></i>
                         </button>
                       </div>
+                      <ok-error [control]="form.controls['date'].controls['validTo']" class="w-100"></ok-error>
                     </div>
                   </div>
                 </div>
diff --git a/src/app/masterdata-management/components/user/user.component.spec.ts b/src/app/masterdata-management/components/user/user.component.spec.ts
index 9ed21df..d1f8fd0 100644
--- a/src/app/masterdata-management/components/user/user.component.spec.ts
+++ b/src/app/masterdata-management/components/user/user.component.spec.ts
@@ -7,8 +7,7 @@
  *
  * SPDX-License-Identifier: EPL-2.0
  ********************************************************************************/
-import { async, ComponentFixture, TestBed, inject } from '@angular/core/testing';
-import { FormControl, Validators, FormGroup } from '@angular/forms';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 import { RouterTestingModule } from '@angular/router/testing';
 import { of } from 'rxjs';
 import { ActivatedRoute, Routes, Router } from '@angular/router';
@@ -117,8 +116,10 @@
       component.form.patchValue({
         firstname: 'test',
         lastname: 'test',
-        validFrom: { day: 1, month: 1, year: 2018 },
-        validTo: { day: 1, month: 1, year: 2018 }
+        date: {
+          validFrom: { day: 1, month: 1, year: 2018 },
+          validTo: { day: 1, month: 1, year: 2018 }
+        }
       });
       expect(component.saveUser()).toBeTruthy();
     });
@@ -128,8 +129,10 @@
       component.form.patchValue({
         firstname: 'test',
         lastname: 'test',
-        validFrom: { day: 1, month: 1, year: 2018 },
-        validTo: { day: 1, month: 1, year: 2018 }
+        date: {
+          validFrom: { day: 1, month: 1, year: 2018 },
+          validTo: { day: 1, month: 1, year: 2018 }
+        }
       });
       component.isModal = true;
       component.saveUser();
@@ -157,7 +160,7 @@
     it('should set validFrom to current day', () => {
       const date = new Date();
       component.setDefaultDate('validFrom');
-      expect(component.form.controls.validFrom.value).toEqual({
+      expect(component.form.get('validFrom').value).toEqual({
         day: date.getDate(), month: date.getMonth() + 1, year: date.getFullYear()
       });
     });
@@ -165,7 +168,7 @@
     it('should set validTo to current day + 15 years', () => {
       const date = new Date();
       component.setDefaultDate('validTo');
-      expect(component.form.controls.validTo.value).toEqual({
+      expect(component.form.get('validTo').value).toEqual({
         day: date.getDate(), month: date.getMonth() + 1, year: date.getFullYear() + 15
       });
     });
diff --git a/src/app/masterdata-management/components/user/user.component.ts b/src/app/masterdata-management/components/user/user.component.ts
index efdacba..7ff43d6 100644
--- a/src/app/masterdata-management/components/user/user.component.ts
+++ b/src/app/masterdata-management/components/user/user.component.ts
@@ -89,8 +89,10 @@
       if (this.instanceId) {
         this.user$ = this.masterDataService.getUser(this.instanceId).subscribe(
           data => {
-            data.validFrom = this.ngbDateParserFormatter.parse(data.validFrom);
-            data.validTo = this.ngbDateParserFormatter.parse(data.validTo);
+            data.date = {
+              validFrom: this.ngbDateParserFormatter.parse(data.validFrom),
+              validTo: this.ngbDateParserFormatter.parse(data.validTo)
+            };
             this.form.patchValue(data);
             this.targetRegion = data.lsUserInRegions;
             this.targetFunction = data.lsUserFunctions;
@@ -148,8 +150,10 @@
       businessContactData: this.createBusinessContact(),
       privateContactData: this.createPrivateContact(),
       privateAddress: this.createAddress(),
-      validFrom: ['', Validators.required],
-      validTo: ['', [Validators.required, DatepickerValidator.dateRangeTo('validFrom')]],
+      date: this.fb.group({
+        validFrom: ['', Validators.required],
+        validTo: ['', Validators.required],
+      }, { validator: [DatepickerValidator.dateRangeTo('')] }),
       modificationDate: '',
       notes: '',
       hrNumber: '',
@@ -163,8 +167,10 @@
       firstname: ['', Validators.required],
       lastname: ['', Validators.required],
       isCompany: false,
-      validFrom: ['', Validators.required],
-      validTo: ['', [Validators.required, DatepickerValidator.dateRangeTo('validFrom')]],
+      date: this.fb.group({
+        validFrom: ['', Validators.required],
+        validTo: ['', [Validators.required, DatepickerValidator.dateRangeTo('validFrom')]],
+      }, { validator: [DatepickerValidator.dateRangeTo('')] }),
       notes: '',
       hrNumber: '',
       userKey: ''
diff --git a/src/app/masterdata-management/selection-dialogs/validity-dialog/validity-dialog.component.html b/src/app/masterdata-management/selection-dialogs/validity-dialog/validity-dialog.component.html
index 33b4f91..f871e4d 100644
--- a/src/app/masterdata-management/selection-dialogs/validity-dialog/validity-dialog.component.html
+++ b/src/app/masterdata-management/selection-dialogs/validity-dialog/validity-dialog.component.html
@@ -17,7 +17,7 @@
 </div>
 <div class="modal-body">
   <form class="mt-3" [formGroup]="form" novalidate>
-    <div class="row">
+    <div class="row" formGroupName="date">
       <label class="form-check-label col-form-label col-md-3">
         Gültigkeit
       </label>
@@ -37,8 +37,9 @@
                 <i class="fa fa-clock-o" aria-hidden="true"></i>
               </button>
             </div>
+            <ok-error [control]="form.controls['date'].controls['validFrom']" class="w-100"></ok-error>
           </div>
-          <ok-error [control]="form.controls['validTo']"></ok-error>
+          <ok-error [control]="form.controls['date']"></ok-error>
         </div>
       </div>
       <div class="col-md-4">
@@ -57,6 +58,7 @@
                 <i class="fa fa-clock-o" aria-hidden="true"></i>
               </button>
             </div>
+            <ok-error [control]="form.controls['date'].controls['validTo']" class="w-100"></ok-error>
           </div>
         </div>
       </div>
diff --git a/src/app/masterdata-management/selection-dialogs/validity-dialog/validity-dialog.component.spec.ts b/src/app/masterdata-management/selection-dialogs/validity-dialog/validity-dialog.component.spec.ts
index 3f54f69..fb27778 100644
--- a/src/app/masterdata-management/selection-dialogs/validity-dialog/validity-dialog.component.spec.ts
+++ b/src/app/masterdata-management/selection-dialogs/validity-dialog/validity-dialog.component.spec.ts
@@ -44,7 +44,12 @@
 
   describe('decide()', () => {
     it('should prepare the data and call decide', () => {
-      component.form.patchValue({ validFrom: { day: 1, month: 1, year: 2018 }, validTo: { day: 1, month: 1, year: 2018 } });
+      component.form.patchValue({
+        date: {
+          validFrom: { day: 1, month: 1, year: 2018 },
+          validTo: { day: 1, month: 1, year: 2018 }
+        }
+      });
       component.decide(true);
     });
     it('should validate form fields if decision is true and form fields are invalid', () => {
@@ -57,7 +62,7 @@
     it('should set validFrom to current day', () => {
       const date = new Date();
       component.setDefaultDate('validFrom');
-      expect(component.form.controls.validFrom.value).toEqual({
+      expect(component.form.get('validFrom').value).toEqual({
         day: date.getDate(), month: date.getMonth() + 1, year: date.getFullYear()
       });
     });
@@ -65,7 +70,7 @@
     it('should set validTo to current day + 15 years', () => {
       const date = new Date();
       component.setDefaultDate('validTo');
-      expect(component.form.controls.validTo.value).toEqual({
+      expect(component.form.get('validTo').value).toEqual({
         day: date.getDate(), month: date.getMonth() + 1, year: date.getFullYear() + 15
       });
     });
diff --git a/src/app/masterdata-management/selection-dialogs/validity-dialog/validity-dialog.component.ts b/src/app/masterdata-management/selection-dialogs/validity-dialog/validity-dialog.component.ts
index b6a1652..31824c1 100644
--- a/src/app/masterdata-management/selection-dialogs/validity-dialog/validity-dialog.component.ts
+++ b/src/app/masterdata-management/selection-dialogs/validity-dialog/validity-dialog.component.ts
@@ -26,8 +26,10 @@
   saveButtonLabel = 'Verschieben';
 
   form: FormGroup = this.fb.group({
-    validFrom: ['', Validators.required],
-    validTo: ['', [Validators.required, DatepickerValidator.dateRangeTo('validFrom')]],
+    date: this.fb.group({
+      validFrom: ['', Validators.required],
+      validTo: ['', [Validators.required]],
+    }, { validator: [DatepickerValidator.dateRangeTo('')] }),
     position: ''
   });
   constructor(
diff --git a/src/app/reporting/components/dashboard/dashboard.component.html b/src/app/reporting/components/dashboard/dashboard.component.html
index 5defa66..d7c9c12 100644
--- a/src/app/reporting/components/dashboard/dashboard.component.html
+++ b/src/app/reporting/components/dashboard/dashboard.component.html
@@ -33,7 +33,7 @@
                 <label class="form-check-label col-form-label col-md-3">
                   Abfragezeit
                 </label>
-                <div class="input-group col-md-5">
+                <div class="input-group col-md-5" formGroupName="date">
                   <input class="form-control" placeholder="von" name="dp" ngbDatepicker #dateIndex="ngbDatepicker"
                     formControlName="dateIndex" required id="validityDateFromInput">
                   <div class="input-group-append">
@@ -47,12 +47,12 @@
                       <i class="fa fa-clock-o" aria-hidden="true"></i>
                     </button>
                   </div>
+                  <ok-error [control]="form.controls['date'].controls['dateIndex']" class="w-100"></ok-error>
                 </div>
                 <div class="col-md-3">
                   <ngb-timepicker formControlName="timeIndex" id="moveTimePickerFrom"></ngb-timepicker>
                   <ok-error [control]="form.controls['timeIndex']"></ok-error>
                 </div>
-                <ok-error [control]="form.controls['validTo']"></ok-error>
               </div>
             </div>
             <div class="col-md-12 col-sm-12 col-xl-6">
@@ -123,8 +123,8 @@
           <ng-container *ngFor="let row of rowData">
             <tr>
               <td><button class="btn btn-primary btn-sm" (click)="row.isCollapsed = !row.isCollapsed" title="Details anzeigen">
-                <i class="fa fa-eye" aria-hidden="true"></i>
-              </button></td>
+                  <i class="fa fa-eye" aria-hidden="true"></i>
+                </button></td>
               <td scope="row">{{row.standbyGroup?.title}}</td>
               <td scope="row">{{row.user?.organisation?.orgaName}}</td>
               <td scope="row">{{row.user?.firstname}}</td>
diff --git a/src/app/reporting/components/dashboard/dashboard.component.ts b/src/app/reporting/components/dashboard/dashboard.component.ts
index 7b20ee5..c134888 100644
--- a/src/app/reporting/components/dashboard/dashboard.component.ts
+++ b/src/app/reporting/components/dashboard/dashboard.component.ts
@@ -57,7 +57,9 @@
   createForm() {
     let now = new Date();
     this.form = this.fb.group({
-      dateIndex: ['', Validators.required],
+      date: this.fb.group({
+        dateIndex: ['', Validators.required],
+      }),
       timeIndex: {
         hour: now.getHours(),
         minute: now.getMinutes(),
diff --git a/src/app/reporting/components/standby-reporting/standby-reporting.component.html b/src/app/reporting/components/standby-reporting/standby-reporting.component.html
index 1b237ce..572eea6 100644
--- a/src/app/reporting/components/standby-reporting/standby-reporting.component.html
+++ b/src/app/reporting/components/standby-reporting/standby-reporting.component.html
@@ -68,7 +68,7 @@
         </div>
         <div class="row">
           <div class="col-md-12 col-sm-12 col-xl-6">
-            <div class="row">
+            <div class="row" formGroupName="date">
               <label class="form-check-label col-form-label col-md-3">
                 Gültigkeit
               </label>
@@ -88,8 +88,9 @@
                         <i class="fa fa-clock-o" aria-hidden="true"></i>
                       </button>
                     </div>
+                    <ok-error [control]="form.controls['date'].controls['validFrom']" class="w-100"></ok-error>
                   </div>
-                  <ok-error [control]="form.controls['validFrom']"></ok-error>
+                  <ok-error [control]="form.controls['date']"></ok-error>
                 </div>
               </div>
               <div class="col-sm-1">
@@ -111,8 +112,8 @@
                         <i class="fa fa-clock-o" aria-hidden="true"></i>
                       </button>
                     </div>
+                    <ok-error [control]="form.controls['date'].controls['validTo']" class="w-100"></ok-error>
                   </div>
-                  <ok-error [control]="form.controls['validTo']"></ok-error>
                 </div>
               </div>
             </div>
diff --git a/src/app/reporting/components/standby-reporting/standby-reporting.component.spec.ts b/src/app/reporting/components/standby-reporting/standby-reporting.component.spec.ts
index 17f71de..3395160 100644
--- a/src/app/reporting/components/standby-reporting/standby-reporting.component.spec.ts
+++ b/src/app/reporting/components/standby-reporting/standby-reporting.component.spec.ts
@@ -92,7 +92,7 @@
     it('should set validFrom to current day', () => {
       const date = new Date();
       component.setDefaultDate('validFrom');
-      expect(component.form.controls.validFrom.value).toEqual({
+      expect(component.form.get('validFrom').value).toEqual({
         day: date.getDate(), month: date.getMonth() + 1, year: date.getFullYear()
       });
     });
@@ -100,7 +100,7 @@
     it('should set validTo to current day + 15 years', () => {
       const date = new Date();
       component.setDefaultDate('validTo');
-      expect(component.form.controls.validTo.value).toEqual({
+      expect(component.form.get('validTo').value).toEqual({
         day: date.getDate(), month: date.getMonth() + 1, year: date.getFullYear() + 15
       });
     });
diff --git a/src/app/reporting/components/standby-reporting/standby-reporting.component.ts b/src/app/reporting/components/standby-reporting/standby-reporting.component.ts
index 4a625eb..2d52a5b 100644
--- a/src/app/reporting/components/standby-reporting/standby-reporting.component.ts
+++ b/src/app/reporting/components/standby-reporting/standby-reporting.component.ts
@@ -97,8 +97,10 @@
     this.form = this.fb.group({
       standById: ['', Validators.required],
       reportName: ['', Validators.required],
-      validFrom: ['', [Validators.required]],
-      validTo: ['', [Validators.required, DatepickerValidator.dateRangeTo('validFrom')]],
+      date: this.fb.group({
+        validFrom: ['', Validators.required],
+        validTo: ['', Validators.required],
+      }, { validator: [DatepickerValidator.dateRangeTo('')] }),
       printFormat: ['', Validators.required],
       reportLevel: ['Ist-Ebene', Validators.required],
       statusId: 1
@@ -123,11 +125,11 @@
 
     if (clicked) {
       const days = 7;
-      const validFromDate: Date = new Date(formValue.validFrom.year, formValue.validFrom.month - 1, formValue.validFrom.day);
+      const validFromDate: Date = new Date(formValue.date.validFrom.year, formValue.date.validFrom.month - 1, formValue.date.validFrom.day);
       FormUtil.setDefaultReportDate(this.form, 'validTo', days, validFromDate);
     } else {
       const days = 1;
-      const validFromDate: Date = new Date(formValue.validFrom.year, formValue.validFrom.month - 1, formValue.validFrom.day);
+      const validFromDate: Date = new Date(formValue.date.validFrom.year, formValue.date.validFrom.month - 1, formValue.date.validFrom.day);
       FormUtil.setDefaultReportDate(this.form, 'validTo', days, validFromDate);
     }
   }
diff --git a/src/app/shared/model/ArchiveObject.ts b/src/app/shared/model/ArchiveObject.ts
index b3cecfd..e0f4485 100644
--- a/src/app/shared/model/ArchiveObject.ts
+++ b/src/app/shared/model/ArchiveObject.ts
@@ -16,6 +16,10 @@
     modifiedCause: string;
     title: string;
     jsonPlan: string;
+    date?: {
+        validFrom: any;
+        validTo: any;
+    };
     validFrom: any;
     validTo: any;
 }
diff --git a/src/app/shared/model/UserObject.ts b/src/app/shared/model/UserObject.ts
index 9d1c69a..e648727 100644
--- a/src/app/shared/model/UserObject.ts
+++ b/src/app/shared/model/UserObject.ts
@@ -42,6 +42,10 @@
     };
     lsUserInRegions: Array<RegionObject>;
     lsUserFunctions: Array<FunctionObject>;
+    date?: {
+        validFrom: any;
+        validTo: any;
+    };
     validFrom: any; // has to be any since the datepicker uses a different format than the rest service
     validTo: any; // has to be any since the datepicker uses a different format than the rest service
     modificationDate: string;
diff --git a/src/app/shared/utils/form.util.ts b/src/app/shared/utils/form.util.ts
index fb00ec8..fe527b6 100644
--- a/src/app/shared/utils/form.util.ts
+++ b/src/app/shared/utils/form.util.ts
@@ -65,7 +65,10 @@
         if (field === 'validTo') {
             date.setFullYear(date.getFullYear() + 15);
         }
-        form.get(field).setValue(ngbDateFormatter.parse(datePipe.transform(date, 'yyyy-MM-dd')));
+        console.log(form);
+        console.log(field);
+        console.log(form.get('date').get(field));
+        form.get('date').get(field).setValue(ngbDateFormatter.parse(datePipe.transform(date, 'yyyy-MM-dd')));
     }
 
     static setDefaultReportDate(form: FormGroup, field: string, days: number, date: Date) {
@@ -73,7 +76,7 @@
         const datePipe = new DatePipe('en-US');
         const ngbDateFormatter = new NgbDateStringParserFormatter();
 
-        form.get(field).setValue(ngbDateFormatter.parse(datePipe.transform(incrementedDate, 'yyyy-MM-dd')));
+        form.get('date').get(field).setValue(ngbDateFormatter.parse(datePipe.transform(incrementedDate, 'yyyy-MM-dd')));
     }
 
     static addDays(days: number, dateToIncrement: Date): Date {
@@ -85,8 +88,10 @@
     static setInitialDate(form: FormGroup) {
         const date = new Date();
         form.patchValue({
-            validFrom: { day: 1, month: 1, year: date.getFullYear() + 1 },
-            validTo: { day: 31, month: 12, year: date.getFullYear() + 1 }
+            date: {
+                validFrom: { day: 1, month: 1, year: date.getFullYear() + 1 },
+                validTo: { day: 31, month: 12, year: date.getFullYear() + 1 }
+            }
         });
     }
 
@@ -94,7 +99,7 @@
         const date = new Date();
         const patchObj = {};
         patchObj[field] = { day: 31, month: 12, year: date.getFullYear() + 1 };
-        form.patchValue(patchObj);
+        form.get('date').patchValue(patchObj);
     }
 
     static convertToNgbTime(dateString: string): NgbTimeStruct {
@@ -110,13 +115,14 @@
 
     static formatDates(obj: Object, properties: Array<any>): void {
         for (let i = 0; i < properties.length; i++) {
-            if (obj.hasOwnProperty(properties[i])) {
-                const date: NgbDateStruct = obj[properties[i]];
-                if (date.year && date.month && date.day) {
+            if (obj['date'].hasOwnProperty(properties[i])) {
+                const date: NgbDateStruct = obj['date'][properties[i]];
+                if (date && date.year && date.month && date.day) {
                     obj[properties[i]] = `${date.year}-${date.month}-${date.day}`;
                 }
             }
         }
+        delete obj['date'];
     }
 
     static dateToISOString(date: Date) {
diff --git a/src/app/shared/validators/datepicker.validator.ts b/src/app/shared/validators/datepicker.validator.ts
index 1b52166..0dd8bde 100644
--- a/src/app/shared/validators/datepicker.validator.ts
+++ b/src/app/shared/validators/datepicker.validator.ts
@@ -7,16 +7,14 @@
  *
  * SPDX-License-Identifier: EPL-2.0
  ********************************************************************************/
-import { ValidatorFn, AbstractControl } from '@angular/forms';
+import { ValidatorFn, AbstractControl, FormGroup } from '@angular/forms';
 
 export class DatepickerValidator {
-    static dateRangeTo(otherControlName: string): ValidatorFn {
-        return (validTo: AbstractControl): { [key: string]: boolean } | null => {
-            const validFrom: AbstractControl = validTo.root.get(otherControlName);
+    static dateRangeTo(test: string): ValidatorFn {
+        return (form: FormGroup): { [key: string]: boolean } | null => {
+            const validFrom: AbstractControl = form.get('validFrom');
+            const validTo: AbstractControl = form.get('validTo');
             if (validFrom && validFrom.value && validTo.value) {
-                validFrom.valueChanges.subscribe(() => {
-                    validTo.updateValueAndValidity({ onlySelf: true });
-                });
                 const validFromValue = validFrom.value;
                 const validFromDateObj = new Date(validFromValue.year, validFromValue.month - 1, validFromValue.day, 0, 0, 0, 0);
                 const validToValue = validTo.value;
diff --git a/src/app/standby-schedule/components/archive/archive.component.html b/src/app/standby-schedule/components/archive/archive.component.html
index 56e1c20..2448f97 100644
--- a/src/app/standby-schedule/components/archive/archive.component.html
+++ b/src/app/standby-schedule/components/archive/archive.component.html
@@ -48,7 +48,7 @@
                     </div>
                     <div class="row">
                         <div class="col-md-6">
-                            <div class="row">
+                            <div class="row" formGroupName="date">
                                 <label class="form-check-label col-form-label col-md-3">
                                     Zeitraum
                                 </label>
diff --git a/src/app/standby-schedule/components/archive/archive.component.ts b/src/app/standby-schedule/components/archive/archive.component.ts
index a327a40..6bbeb03 100644
--- a/src/app/standby-schedule/components/archive/archive.component.ts
+++ b/src/app/standby-schedule/components/archive/archive.component.ts
@@ -46,8 +46,10 @@
           data => {
             this.plan = JSON.parse(data.jsonPlan);
             data.modificationDate = this.ngbDateParserFormatter.parse(data.modificationDate);
-            data.validFrom = this.ngbDateParserFormatter.parse(data.validFrom);
-            data.validTo = this.ngbDateParserFormatter.parse(data.validTo);
+            data.date = {
+              validFrom: this.ngbDateParserFormatter.parse(data.validFrom),
+              validTo: this.ngbDateParserFormatter.parse(data.validTo)
+            };
             this.form.patchValue(data);
           }
         );
@@ -64,8 +66,10 @@
       modificationDate: { value: '', disabled: true },
       modifiedBy: { value: '', disabled: true },
       modifiedCause: { value: '', disabled: true },
-      validFrom: { value: '', disabled: true },
-      validTo: { value: '', disabled: true }
+      date: this.fb.group({
+        validFrom: { value: '', disabled: true },
+        validTo: { value: '', disabled: true }
+      })
     });
   }
 
diff --git a/src/app/standby-schedule/components/archivelist/archivelist.component.html b/src/app/standby-schedule/components/archivelist/archivelist.component.html
index a08e3d0..202f66d 100644
--- a/src/app/standby-schedule/components/archivelist/archivelist.component.html
+++ b/src/app/standby-schedule/components/archivelist/archivelist.component.html
@@ -32,7 +32,7 @@
               </label>
               <div class="col-md-4">
                 <div class="form-group">
-                  <div class="input-group">
+                  <div class="input-group" formGroupName="date">
                     <input class="form-control" placeholder="von" name="dp" ngbDatepicker #dateIndex="ngbDatepicker"
                       formControlName="dateIndex" id="dateFromInput" required>
                     <div class="input-group-append">
diff --git a/src/app/standby-schedule/components/archivelist/archivelist.component.spec.ts b/src/app/standby-schedule/components/archivelist/archivelist.component.spec.ts
index 9291828..f86669d 100644
--- a/src/app/standby-schedule/components/archivelist/archivelist.component.spec.ts
+++ b/src/app/standby-schedule/components/archivelist/archivelist.component.spec.ts
@@ -73,18 +73,27 @@
 
   describe('search()', () => {
     it('should search if form is valid', () => {
-      component.form.patchValue({ dateIndex: '2018-01-01' });
+      component.form.patchValue({
+        date: { dateIndex: '2018-01-01' }
+      });
       component.search();
     });
     it('shouldn´t search if form is invalid', () => {
-      component.form.patchValue({ dateIndex: '', city: '' });
+      component.form.patchValue({
+        date: { dateIndex: '' },
+        city: ''
+      });
       component.search();
     });
   });
 
   describe('clear()', () => {
     it('should clear the form', () => {
-      component.form.patchValue({ dateIndex: '2018-01-01' });
+      component.form.patchValue({
+        date: {
+          dateIndex: '2018-01-01'
+        }
+      });
       component.clear();
       expect(component.form.getRawValue().dateIndex).toBe(null);
     });
diff --git a/src/app/standby-schedule/components/archivelist/archivelist.component.ts b/src/app/standby-schedule/components/archivelist/archivelist.component.ts
index d085ccc..24b34be 100644
--- a/src/app/standby-schedule/components/archivelist/archivelist.component.ts
+++ b/src/app/standby-schedule/components/archivelist/archivelist.component.ts
@@ -70,7 +70,9 @@
 
   createForm() {
     this.form = this.fb.group({
-      dateIndex: ['', Validators.required]
+      date: this.fb.group({
+        dateIndex: ['', Validators.required]
+      })
     });
   }
 
diff --git a/src/app/standby-schedule/components/planninglist/planninglist.component.html b/src/app/standby-schedule/components/planninglist/planninglist.component.html
index 892c083..256e30b 100644
--- a/src/app/standby-schedule/components/planninglist/planninglist.component.html
+++ b/src/app/standby-schedule/components/planninglist/planninglist.component.html
@@ -40,7 +40,7 @@
         </div>
         <div class="row">
           <div class="col-md-12 col-sm-12 col-xl-8">
-            <div class="row">
+            <div class="row" formGroupName="date">
               <label class="form-check-label col-form-label col-md-3">
                 Gültigkeit
               </label>
@@ -60,8 +60,9 @@
                         <i class="fa fa-clock-o" aria-hidden="true"></i>
                       </button>
                     </div>
+                    <ok-error [control]="form.controls['date'].controls['validFrom']" class="w-100"></ok-error>
                   </div>
-                  <ok-error [control]="form.controls['validTo']"></ok-error>
+                  <ok-error [control]="form.controls['date']"></ok-error>
                 </div>
               </div>
               <div class="col-md-3">
@@ -80,6 +81,7 @@
                         <i class="fa fa-clock-o" aria-hidden="true"></i>
                       </button>
                     </div>
+                    <ok-error [control]="form.controls['date'].controls['validTo']" class="w-100"></ok-error>
                   </div>
                 </div>
               </div>
@@ -87,7 +89,8 @@
                 <div class="btn-group mr-3 w-99">
                   <button type="button" class="btn btn-primary w-99" (click)="prepareDataAndCall('search')" id="btnSearch">Suchen</button>
                   <div class="btn-group" ngbDropdown placement="bottom-right" role="group" aria-label="Button group with nested dropdown">
-                    <button class="btn btn-primary dropdown-toggle-split border-left" id="splitButton" ngbDropdownToggle></button>
+                    <button class="btn btn-primary dropdown-toggle-split border-left" id="splitButton"
+                      ngbDropdownToggle></button>
                     <div class="dropdown-menu dropdown-menu-right" ngbDropdownMenu>
                       <button *ngIf="authService.userHasRoles(['BP_Sachbearbeiter','BP_Admin'])" class="dropdown-item pointer"
                         routerLink="/planung/transfer" id="btnPlan">Ansicht Pläne transferieren</button>
@@ -117,7 +120,8 @@
                 <i class="fa fa-calculator" aria-hidden="true"></i>
               </button>
               <a class="btn btn-xs ml-1 btn-primary" target="_blank" *ngIf="authService.userHasRoles(['BP_Sachbearbeiter', 'BP_Admin'])"
-                [routerLink]="['/stammdatenverwaltung/bereitschaftsgruppe', group.id]" [id]="['btnEditGroup' + group.id]" title="Bereitschaftsgruppe bearbeiten">
+                [routerLink]="['/stammdatenverwaltung/bereitschaftsgruppe', group.id]" [id]="['btnEditGroup' + group.id]"
+                title="Bereitschaftsgruppe bearbeiten">
                 <i class="fa fa-pencil" aria-hidden="true"></i>
               </a>
               <button class="btn btn-xs ml-1 btn-primary" (click)="validatePlan(group.id)" [id]="['btnValidate' + group.id]"
diff --git a/src/app/standby-schedule/components/planninglist/planninglist.component.spec.ts b/src/app/standby-schedule/components/planninglist/planninglist.component.spec.ts
index d731726..ba0e28c 100644
--- a/src/app/standby-schedule/components/planninglist/planninglist.component.spec.ts
+++ b/src/app/standby-schedule/components/planninglist/planninglist.component.spec.ts
@@ -118,8 +118,10 @@
     it('should open a modal and start calculation if the action is "calculate"', () => {
       component.form.patchValue({
         standbyListId: 1,
-        validFrom: { day: 1, month: 10, year: 2018 },
-        validTo: { day: 2, month: 10, year: 2018 },
+        date: {
+          validFrom: { day: 1, month: 10, year: 2018 },
+          validTo: { day: 2, month: 10, year: 2018 },
+        },
         statusId: 1
       });
       component.openCalculationModal(1);
@@ -128,8 +130,10 @@
     it('shouldn´t start a calculation if the action is not "calculate"', () => {
       component.form.patchValue({
         standbyListId: 1,
-        validFrom: { day: 1, month: 10, year: 2018 },
-        validTo: { day: 2, month: 10, year: 2018 },
+        date: {
+          validFrom: { day: 1, month: 10, year: 2018 },
+          validTo: { day: 2, month: 10, year: 2018 },
+        },
         statusId: 1
       });
       component.openCalculationModal(1);
@@ -140,8 +144,10 @@
     it('should search for bodies', () => {
       component.form.patchValue({
         standbyListId: 1,
-        validFrom: { day: 1, month: 10, year: 2018 },
-        validTo: { day: 2, month: 10, year: 2018 }
+        date: {
+          validFrom: { day: 1, month: 10, year: 2018 },
+          validTo: { day: 2, month: 10, year: 2018 }
+        }
       });
       component.prepareDataAndCall('search');
     });
@@ -149,8 +155,10 @@
     it('shouldn´t search for bodies as form is invalid', () => {
       component.form.patchValue({
         standbyListId: 1,
-        validFrom: '',
-        validTo: ''
+        date: {
+          validFrom: '',
+          validTo: ''
+        }
       });
       component.prepareDataAndCall('search');
     });
@@ -160,8 +168,10 @@
     it('should archive bodies', () => {
       component.form.patchValue({
         standbyListId: 1,
-        validFrom: { day: 1, month: 10, year: 2018 },
-        validTo: { day: 2, month: 10, year: 2018 }
+        date: {
+          validFrom: { day: 1, month: 10, year: 2018 },
+          validTo: { day: 2, month: 10, year: 2018 }
+        }
       });
       component.prepareDataAndCall('archive');
     });
@@ -169,8 +179,10 @@
     it('shouldn´t archive bodies as form is invalid', () => {
       component.form.patchValue({
         standbyListId: 1,
-        validFrom: '',
-        validTo: '',
+        date: {
+          validFrom: '',
+          validTo: '',
+        },
         statusId: 1
       });
       component.prepareDataAndCall('archive');
@@ -185,8 +197,10 @@
     it('should open archive modal and archive plan if decision is true and data is returned', () => {
       component.form.patchValue({
         standbyListId: 1,
-        validFrom: { day: 1, month: 10, year: 2018 },
-        validTo: { day: 2, month: 10, year: 2018 }
+        date: {
+          validFrom: { day: 1, month: 10, year: 2018 },
+          validTo: { day: 2, month: 10, year: 2018 }
+        }
       });
       component.prepareDataAndCall('archive');
       component.archiveModalRef.componentInstance.decision.next({ title: 'test', comment: 'test' });
@@ -195,8 +209,10 @@
     it('should close the modal without any rest call if the data is undefined', () => {
       component.form.patchValue({
         standbyListId: 1,
-        validFrom: { day: 1, month: 10, year: 2018 },
-        validTo: { day: 2, month: 10, year: 2018 }
+        date: {
+          validFrom: { day: 1, month: 10, year: 2018 },
+          validTo: { day: 2, month: 10, year: 2018 }
+        }
       });
       component.prepareDataAndCall('archive');
       component.archiveModalRef.componentInstance.decision.next(undefined);
@@ -273,7 +289,7 @@
     it('should set validFrom to current day', () => {
       const date = new Date();
       component.setDefaultDate('validFrom');
-      expect(component.form.controls.validFrom.value).toEqual({
+      expect(component.form.get('date').get('validFrom').value).toEqual({
         day: date.getDate(), month: date.getMonth() + 1, year: date.getFullYear()
       });
     });
@@ -281,7 +297,7 @@
     it('should set validTo to current day + 15 years', () => {
       const date = new Date();
       component.setDefaultDate('validTo');
-      expect(component.form.controls.validTo.value).toEqual({
+      expect(component.form.get('date').get('validTo').value).toEqual({
         day: date.getDate(), month: date.getMonth() + 1, year: date.getFullYear() + 15
       });
     });
@@ -291,8 +307,10 @@
     it('should validate whole plan with all the groups in a standbylist', () => {
       component.form.patchValue({
         standbyListId: 1,
-        validFrom: { day: 1, month: 10, year: 2018 },
-        validTo: { day: 2, month: 10, year: 2018 }
+        date: {
+          validFrom: { day: 1, month: 10, year: 2018 },
+          validTo: { day: 2, month: 10, year: 2018 }
+        }
       });
       component.validatePlan(undefined);
     });
@@ -300,8 +318,10 @@
     it('should validate the given group', () => {
       component.form.patchValue({
         standbyListId: '',
-        validFrom: { day: 1, month: 10, year: 2018 },
-        validTo: { day: 2, month: 10, year: 2018 }
+        date: {
+          validFrom: { day: 1, month: 10, year: 2018 },
+          validTo: { day: 2, month: 10, year: 2018 }
+        }
       });
       component.validatePlan(1);
     });
@@ -311,8 +331,10 @@
     it('should import into planning', () => {
       component.form.patchValue({
         standbyListId: 1,
-        validFrom: { day: 1, month: 10, year: 2018 },
-        validTo: { day: 2, month: 10, year: 2018 }
+        date: {
+          validFrom: { day: 1, month: 10, year: 2018 },
+          validTo: { day: 2, month: 10, year: 2018 }
+        }
       });
       component.deletePlan();
       component.deleteModalWarningRef.componentInstance.decision.next(true);
@@ -322,8 +344,10 @@
     it('shouldn´t import into planning', () => {
       component.form.patchValue({
         standbyListId: 1,
-        validFrom: { day: 1, month: 10, year: 2018 },
-        validTo: { day: 2, month: 10, year: 2018 }
+        date: {
+          validFrom: { day: 1, month: 10, year: 2018 },
+          validTo: { day: 2, month: 10, year: 2018 }
+        }
       });
       component.deletePlan();
       component.deleteModalWarningRef.componentInstance.decision.next(false);
@@ -333,8 +357,10 @@
     it('should return false on validating the form', () => {
       component.form.patchValue({
         standbyListId: '',
-        validFrom: { day: 1, month: 10, year: 2018 },
-        validTo: { day: 2, month: 10, year: 2018 }
+        date: {
+          validFrom: { day: 1, month: 10, year: 2018 },
+          validTo: { day: 2, month: 10, year: 2018 }
+        }
       });
       component.deletePlan();
     });
diff --git a/src/app/standby-schedule/components/planninglist/planninglist.component.ts b/src/app/standby-schedule/components/planninglist/planninglist.component.ts
index 3b9c7e5..99fd249 100644
--- a/src/app/standby-schedule/components/planninglist/planninglist.component.ts
+++ b/src/app/standby-schedule/components/planninglist/planninglist.component.ts
@@ -117,8 +117,11 @@
   createForm() {
     this.form = this.fb.group({
       standbyListId: ['', Validators.required],
-      validFrom: ['', [Validators.required]],
-      validTo: ['', [Validators.required, DatepickerValidator.dateRangeTo('validFrom')]]
+      date: this.fb.group({
+        validFrom: ['', [Validators.required]],
+        validTo: ['', [Validators.required]]
+      }, { validator: [DatepickerValidator.dateRangeTo('')] }
+      )
     });
   }
 
@@ -173,8 +176,8 @@
     this.modalCalculationRef.componentInstance.form.patchValue({
       standbyListId: currentForm.standbyListId,
       standbyGroupId: standbyGroupId,
-      validFrom: currentForm.validFrom,
-      validTo: currentForm.validTo
+      validFrom: currentForm.date.validFrom,
+      validTo: currentForm.date.validTo
     });
     const modalAction: Subscription = this.modalCalculationRef.componentInstance.modalAction.subscribe((res: ModalTransferObject) => {
       if (res.action === 'calculate') {
@@ -243,8 +246,10 @@
       statusId: this.planStatusId,
       standbyGroupId: this.currentStandby.standbyGroup.id,
       currentUserId: this.currentStandby.user.id,
-      validFrom: this.ngbDateParserFormatter.parse(this.currentStandby.validFrom),
-      validTo: this.ngbDateParserFormatter.parse(this.currentStandby.validTo),
+      date: {
+        validFrom: this.ngbDateParserFormatter.parse(this.currentStandby.validFrom),
+        validTo: this.ngbDateParserFormatter.parse(this.currentStandby.validTo)
+      },
       validFromTime: FormUtil.convertToNgbTime(this.currentStandby.validFrom),
       validToTime: FormUtil.convertToNgbTime(this.currentStandby.validTo)
     });
@@ -271,8 +276,10 @@
       scheduleBodyId: this.currentStandby.id,
       newUserId: this.currentStandby.user.id,
       statusId: this.planStatusId,
-      validFrom: this.ngbDateParserFormatter.parse(this.currentStandby.validFrom),
-      validTo: this.ngbDateParserFormatter.parse(this.currentStandby.validTo),
+      date: {
+        validFrom: this.ngbDateParserFormatter.parse(this.currentStandby.validFrom),
+        validTo: this.ngbDateParserFormatter.parse(this.currentStandby.validTo)
+      },
       validFromTime: FormUtil.convertToNgbTime(this.currentStandby.validFrom),
       validToTime: FormUtil.convertToNgbTime(this.currentStandby.validTo)
     });
diff --git a/src/app/standby-schedule/dialogs/calculate-dialog/calculate-dialog.component.html b/src/app/standby-schedule/dialogs/calculate-dialog/calculate-dialog.component.html
index 31244d8..b8e49fa 100644
--- a/src/app/standby-schedule/dialogs/calculate-dialog/calculate-dialog.component.html
+++ b/src/app/standby-schedule/dialogs/calculate-dialog/calculate-dialog.component.html
@@ -20,7 +20,8 @@
               <div class="col-sm-9">
                 <select class="form-control" id="startIdOfUser" formControlName="startIdOfUser" required>
                   <option value=""></option>
-                  <option *ngFor="let user of listOfStandbyUsers" [value]="user.id">{{user.firstname + ' ' + user.lastname}}</option>
+                  <option *ngFor="let user of listOfStandbyUsers" [value]="user.id">{{user.firstname + ' ' +
+                    user.lastname}}</option>
                 </select>
                 <ok-error [control]="form.controls['startIdOfUser']"></ok-error>
               </div>
@@ -29,15 +30,15 @@
         </div>
         <div class="row">
           <div class="col-md-12 col-sm-12 col-xl-12">
-            <div class="row">
+            <div class="row" formGroupName="date">
               <label class="form-check-label col-form-label col-md-3">
                 Gültigkeit
               </label>
               <div class="col-md-4">
                 <div class="form-group">
                   <div class="input-group">
-                    <input class="form-control" placeholder="von" name="dp" ngbDatepicker #validFrom="ngbDatepicker" formControlName="validFrom"
-                      required id="CalcDateFromInput">
+                    <input class="form-control" placeholder="von" name="dp" ngbDatepicker #validFrom="ngbDatepicker"
+                      formControlName="validFrom" required id="CalcDateFromInput">
                     <div class="input-group-append">
                       <button class="btn btn-outline-secondary" (click)="validFrom.toggle()" type="button" id="CalcDateFromPicker">
                         <i class="fa fa-calendar" aria-hidden="true"></i>
@@ -49,15 +50,16 @@
                         <i class="fa fa-clock-o" aria-hidden="true"></i>
                       </button>
                     </div>
+                    <ok-error [control]="form.controls['date'].controls['validFrom']" class="w-100"></ok-error>
                   </div>
-                  <ok-error [control]="form.controls['validTo']"></ok-error>
+                  <ok-error [control]="form.controls['date']"></ok-error>
                 </div>
               </div>
               <div class="col-md-4">
                 <div class="form-group">
                   <div class="input-group">
-                    <input class="form-control" placeholder="bis" name="dp" ngbDatepicker #validTo="ngbDatepicker" formControlName="validTo"
-                      required id="CalcDateToInput">
+                    <input class="form-control" placeholder="bis" name="dp" ngbDatepicker #validTo="ngbDatepicker"
+                      formControlName="validTo" required id="CalcDateToInput">
                     <div class="input-group-append">
                       <button class="btn btn-outline-secondary" (click)="validTo.toggle()" type="button" id="CalcDateToPicker">
                         <i class="fa fa-calendar" aria-hidden="true"></i>
@@ -69,6 +71,7 @@
                         <i class="fa fa-clock-o" aria-hidden="true"></i>
                       </button>
                     </div>
+                    <ok-error [control]="form.controls['date'].controls['validTo']" class="w-100"></ok-error>
                   </div>
                 </div>
               </div>
diff --git a/src/app/standby-schedule/dialogs/calculate-dialog/calculate-dialog.component.spec.ts b/src/app/standby-schedule/dialogs/calculate-dialog/calculate-dialog.component.spec.ts
index 50f2357..22a6dd7 100644
--- a/src/app/standby-schedule/dialogs/calculate-dialog/calculate-dialog.component.spec.ts
+++ b/src/app/standby-schedule/dialogs/calculate-dialog/calculate-dialog.component.spec.ts
@@ -45,7 +45,12 @@
   });
 
   it('should send calculation data to parent component if the form is valid', () => {
-    component.form.patchValue({ validFrom: '2023-05-08T05:05:05.789Z', validTo: '2023-05-08T05:05:05.789Z' });
+    component.form.patchValue({
+      date: {
+        validFrom: '2023-05-08T05:05:05.789Z',
+        validTo: '2023-05-08T05:05:05.789Z'
+      }
+    });
     component.calculate();
     component.modalAction.subscribe((transferData: ModalTransferObject) => {
       expect(transferData.action).toBe('calculate');
@@ -56,7 +61,7 @@
     it('should set validFrom to current day', () => {
       const date = new Date();
       component.setDefaultDate('validFrom');
-      expect(component.form.controls.validFrom.value).toEqual({
+      expect(component.form.get('validFrom').value).toEqual({
         day: date.getDate(), month: date.getMonth() + 1, year: date.getFullYear()
       });
     });
@@ -64,7 +69,7 @@
     it('should set validTo to current day + 15 years', () => {
       const date = new Date();
       component.setDefaultDate('validTo');
-      expect(component.form.controls.validTo.value).toEqual({
+      expect(component.form.get('validTo').value).toEqual({
         day: date.getDate(), month: date.getMonth() + 1, year: date.getFullYear() + 15
       });
     });
diff --git a/src/app/standby-schedule/dialogs/calculate-dialog/calculate-dialog.component.ts b/src/app/standby-schedule/dialogs/calculate-dialog/calculate-dialog.component.ts
index c6d8e7b..b930651 100644
--- a/src/app/standby-schedule/dialogs/calculate-dialog/calculate-dialog.component.ts
+++ b/src/app/standby-schedule/dialogs/calculate-dialog/calculate-dialog.component.ts
@@ -55,8 +55,10 @@
 
   createForm() {
     this.form = this.fb.group({
-      validFrom: ['', Validators.required],
-      validTo: ['', [Validators.required, DatepickerValidator.dateRangeTo('validFrom')]],
+      date: this.fb.group({
+        validFrom: ['', Validators.required],
+        validTo: ['', Validators.required],
+      }, { validator: [DatepickerValidator.dateRangeTo('')] }),
       startIdOfUser: ['', Validators.required],
       standbyGroupId: '',
       standbyListId: ''
diff --git a/src/app/standby-schedule/dialogs/move-dialog/move-dialog.component.html b/src/app/standby-schedule/dialogs/move-dialog/move-dialog.component.html
index a0d730b..a353e82 100644
--- a/src/app/standby-schedule/dialogs/move-dialog/move-dialog.component.html
+++ b/src/app/standby-schedule/dialogs/move-dialog/move-dialog.component.html
@@ -23,7 +23,7 @@
           <label class="form-check-label col-form-label col-md-5">
             Von
           </label>
-          <div class="input-group col-md-7">
+          <div class="input-group col-md-7" formGroupName="date">
             <input class="form-control" placeholder="von" name="dp" ngbDatepicker #validFrom="ngbDatepicker"
               formControlName="validFrom" required id="validityDateFromInput">
             <div class="input-group-append">
@@ -37,8 +37,9 @@
                 <i class="fa fa-clock-o" aria-hidden="true"></i>
               </button>
             </div>
+            <ok-error [control]="form.controls['date']" class="w-100"></ok-error>
+            <ok-error [control]="form.controls['date'].controls['validFrom']" class="w-100"></ok-error>
           </div>
-          <ok-error [control]="form.controls['validTo']"></ok-error>
         </div>
       </div>
       <div class="col-md-3">
@@ -51,7 +52,7 @@
           <label class="form-check-label col-form-label col-md-5">
             Bis
           </label>
-          <div class="input-group col-md-7">
+          <div class="input-group col-md-7" formGroupName="date">
             <input class="form-control" placeholder="bis" name="dp" ngbDatepicker #validTo="ngbDatepicker"
               formControlName="validTo" required id="validityDateToInput">
             <div class="input-group-append">
@@ -65,6 +66,7 @@
                 <i class="fa fa-clock-o" aria-hidden="true"></i>
               </button>
             </div>
+            <ok-error [control]="form.controls['date'].controls['validTo']" class="w-100"></ok-error>
           </div>
         </div>
       </div>
diff --git a/src/app/standby-schedule/dialogs/move-dialog/move-dialog.component.spec.ts b/src/app/standby-schedule/dialogs/move-dialog/move-dialog.component.spec.ts
index 6b895e9..b167206 100644
--- a/src/app/standby-schedule/dialogs/move-dialog/move-dialog.component.spec.ts
+++ b/src/app/standby-schedule/dialogs/move-dialog/move-dialog.component.spec.ts
@@ -14,7 +14,6 @@
 
 import { MoveDialogComponent } from './move-dialog.component';
 import { SharedModule } from '@shared/shared.module';
-import { FormUtil } from '@shared/utils/form.util';
 
 describe('MoveDialogComponent', () => {
   let component: MoveDialogComponent;
@@ -46,11 +45,21 @@
 
   describe('decide()', () => {
     it('should prepare the data and call decide', () => {
-      component.form.patchValue({ validFrom: { day: 1, month: 1, year: 2018 }, validTo: { day: 1, month: 1, year: 2018 } });
+      component.form.patchValue({
+        date: {
+          validFrom: { day: 1, month: 1, year: 2018 },
+          validTo: { day: 1, month: 1, year: 2018 }
+        }
+      });
       component.decide(true);
     });
     it('should validate form fields if decision is true and form fields are invalid', () => {
-      component.form.patchValue({ validFrom: '', validTo: '' });
+      component.form.patchValue({
+        date: {
+          validFrom: '',
+          validTo: ''
+        }
+      });
       component.decide(true);
       expect(component.form.valid).toBeFalsy();
     });
@@ -60,7 +69,7 @@
     it('should set validFrom to current day', () => {
       const date = new Date();
       component.setDefaultDate('validFrom');
-      expect(component.form.controls.validFrom.value).toEqual({
+      expect(component.form.get('validFrom').value).toEqual({
         day: date.getDate(), month: date.getMonth() + 1, year: date.getFullYear()
       });
     });
@@ -68,7 +77,7 @@
     it('should set validTo to current day + 15 years', () => {
       const date = new Date();
       component.setDefaultDate('validTo');
-      expect(component.form.controls.validTo.value).toEqual({
+      expect(component.form.get('validTo').value).toEqual({
         day: date.getDate(), month: date.getMonth() + 1, year: date.getFullYear() + 15
       });
     });
diff --git a/src/app/standby-schedule/dialogs/move-dialog/move-dialog.component.ts b/src/app/standby-schedule/dialogs/move-dialog/move-dialog.component.ts
index b285f02..7dba4fb 100644
--- a/src/app/standby-schedule/dialogs/move-dialog/move-dialog.component.ts
+++ b/src/app/standby-schedule/dialogs/move-dialog/move-dialog.component.ts
@@ -28,8 +28,10 @@
   standbyGroupList: Array<StandbygroupObject>;
 
   form: FormGroup = this.fb.group({
-    validFrom: ['', Validators.required],
-    validTo: ['', [Validators.required, DatepickerValidator.dateRangeTo('validFrom')]],
+    date: this.fb.group({
+      validFrom: ['', Validators.required],
+      validTo: ['', Validators.required],
+    }, { validator: [DatepickerValidator.dateRangeTo('')] }),
     validFromTime: '',
     validToTime: '',
     standbyGroupId: ['', Validators.required],
diff --git a/src/app/standby-schedule/dialogs/replace-dialog/replace-dialog.component.html b/src/app/standby-schedule/dialogs/replace-dialog/replace-dialog.component.html
index c3d158a..715b020 100644
--- a/src/app/standby-schedule/dialogs/replace-dialog/replace-dialog.component.html
+++ b/src/app/standby-schedule/dialogs/replace-dialog/replace-dialog.component.html
@@ -17,63 +17,56 @@
 </div>
 <div class="modal-body">
   <form class="mt-3" [formGroup]="form" novalidate>
-    <div class="form-group row d-flex align-items-center h-100">
-      <label class="form-check-label col-form-label col-md-3">
-        Von
-      </label>
-      <div class="input-group col-md-6">
-        <input class="form-control" placeholder="von" name="dp" ngbDatepicker #validFrom="ngbDatepicker"
-          formControlName="validFrom" required id="validityDateFromInput">
-        <div class="input-group-append">
-          <button class="btn btn-outline-secondary" (click)="validFrom.toggle()" type="button" id="validityDateFromPicker">
-            <i class="fa fa-calendar" aria-hidden="true"></i>
-          </button>
+    <div>
+      <div class="form-group row d-flex align-items-center h-100">
+        <label class="form-check-label col-form-label col-md-3">
+          Von
+        </label>
+        <div class="input-group col-md-6" formGroupName="date">
+          <input class="form-control" placeholder="von" name="dp" ngbDatepicker #validFrom="ngbDatepicker"
+            formControlName="validFrom" required id="validityDateFromInput">
+          <div class="input-group-append">
+            <button class="btn btn-outline-secondary" (click)="validFrom.toggle()" type="button" id="validityDateFromPicker">
+              <i class="fa fa-calendar" aria-hidden="true"></i>
+            </button>
+          </div>
+          <div class="input-group-append">
+            <button class="btn btn-outline-secondary" (click)="setDefaultDate('validFrom')" type="button" id="validityDateFromDefault"
+              data-toggle="tooltip" data-placement="bottom" title="Auf Standardwert setzen">
+              <i class="fa fa-clock-o" aria-hidden="true"></i>
+            </button>
+          </div>
+          <ok-error [control]="form.controls['date'].controls['validFrom']" class="w-100"></ok-error>
+          <ok-error [control]="form.controls['date']"></ok-error>
         </div>
-        <div class="input-group-append">
-          <button class="btn btn-outline-secondary" (click)="setDefaultDate('validFrom')" type="button" id="validityDateFromDefault"
-            data-toggle="tooltip" data-placement="bottom" title="Auf Standardwert setzen">
-            <i class="fa fa-clock-o" aria-hidden="true"></i>
-          </button>
+        <div class="col-md-3">
+          <ngb-timepicker formControlName="validFromTime" id="moveTimePickerFrom"></ngb-timepicker>
         </div>
       </div>
-      <div class="col-md-3">
-        <ngb-timepicker formControlName="validFromTime" id="moveTimePickerFrom"></ngb-timepicker>
-      </div>
-    </div>
-    <div class="row">
-      <div class="col-md-12">
-        <ok-error [control]="form.controls['validFrom']"></ok-error>
-        <ok-error [control]="form.controls['validFromTime']"></ok-error>
-      </div>
-    </div>
-    <div class="form-group row d-flex align-items-center h-100">
-      <label class="form-check-label col-form-label col-md-3">
-        Bis
-      </label>
-      <div class="input-group col-md-6">
-        <input class="form-control" placeholder="bis" name="dp" ngbDatepicker #validTo="ngbDatepicker" formControlName="validTo"
-          required id="validityDateToInput">
-        <div class="input-group-append">
-          <button class="btn btn-outline-secondary" (click)="validTo.toggle()" type="button" id="validityDateToPicker">
-            <i class="fa fa-calendar" aria-hidden="true"></i>
-          </button>
+      <div class="form-group row d-flex align-items-center h-100">
+        <label class="form-check-label col-form-label col-md-3">
+          Bis
+        </label>
+        <div class="input-group col-md-6" formGroupName="date">
+          <input class="form-control" placeholder="bis" name="dp" ngbDatepicker #validTo="ngbDatepicker"
+            formControlName="validTo" required id="validityDateToInput">
+          <div class="input-group-append">
+            <button class="btn btn-outline-secondary" (click)="validTo.toggle()" type="button" id="validityDateToPicker">
+              <i class="fa fa-calendar" aria-hidden="true"></i>
+            </button>
+          </div>
+          <div class="input-group-append">
+            <button class="btn btn-outline-secondary" (click)="setDefaultDate('validTo')" type="button" id="validityDateToDefault"
+              data-toggle="tooltip" data-placement="bottom" title="Auf Standardwert setzen">
+              <i class="fa fa-clock-o" aria-hidden="true"></i>
+            </button>
+          </div>
+          <ok-error [control]="form.controls['date'].controls['validTo']" class="w-100"></ok-error>
         </div>
-        <div class="input-group-append">
-          <button class="btn btn-outline-secondary" (click)="setDefaultDate('validTo')" type="button" id="validityDateToDefault"
-            data-toggle="tooltip" data-placement="bottom" title="Auf Standardwert setzen">
-            <i class="fa fa-clock-o" aria-hidden="true"></i>
-          </button>
+        <div class="col-md-3">
+          <ngb-timepicker formControlName="validToTime" id="moveTimePickerTo"></ngb-timepicker>
         </div>
       </div>
-      <div class="col-md-3">
-        <ngb-timepicker formControlName="validToTime" id="moveTimePickerTo"></ngb-timepicker>
-      </div>
-    </div>
-    <div class="row">
-      <div class="col-md-12">
-        <ok-error [control]="form.controls['validTo']"></ok-error>
-        <ok-error [control]="form.controls['validToTime']"></ok-error>
-      </div>
     </div>
     <div class="form-group row">
       <label for="currentUser" class="col-sm-3 col-form-label">Aktuelle Bereitschaft</label>
diff --git a/src/app/standby-schedule/dialogs/replace-dialog/replace-dialog.component.spec.ts b/src/app/standby-schedule/dialogs/replace-dialog/replace-dialog.component.spec.ts
index a3157b6..bebe9ef 100644
--- a/src/app/standby-schedule/dialogs/replace-dialog/replace-dialog.component.spec.ts
+++ b/src/app/standby-schedule/dialogs/replace-dialog/replace-dialog.component.spec.ts
@@ -62,11 +62,21 @@
 
   describe('decide()', () => {
     it('should prepare the data and call decide', () => {
-      component.form.patchValue({ validFrom: { day: 1, month: 1, year: 2018 }, validTo: { day: 1, month: 1, year: 2018 } });
+      component.form.patchValue({
+        date: {
+          validFrom: { day: 1, month: 1, year: 2018 },
+          validTo: { day: 1, month: 1, year: 2018 }
+        }
+      });
       component.decide(true);
     });
     it('should validate form fields if decision is true and form fields are invalid', () => {
-      component.form.patchValue({ validFrom: '', validTo: '' });
+      component.form.patchValue({
+        date: {
+          validFrom: '',
+          validTo: ''
+        }
+      });
       component.decide(true);
       expect(component.form.valid).toBeFalsy();
     });
@@ -76,7 +86,7 @@
     it('should set validFrom to current day', () => {
       const date = new Date();
       component.setDefaultDate('validFrom');
-      expect(component.form.controls.validFrom.value).toEqual({
+      expect(component.form.get('validFrom').value).toEqual({
         day: date.getDate(), month: date.getMonth() + 1, year: date.getFullYear()
       });
     });
@@ -84,7 +94,7 @@
     it('should set validTo to current day + 15 years', () => {
       const date = new Date();
       component.setDefaultDate('validTo');
-      expect(component.form.controls.validTo.value).toEqual({
+      expect(component.form.get('validTo').value).toEqual({
         day: date.getDate(), month: date.getMonth() + 1, year: date.getFullYear() + 15
       });
     });
diff --git a/src/app/standby-schedule/dialogs/replace-dialog/replace-dialog.component.ts b/src/app/standby-schedule/dialogs/replace-dialog/replace-dialog.component.ts
index b5c8976..4e378e9 100644
--- a/src/app/standby-schedule/dialogs/replace-dialog/replace-dialog.component.ts
+++ b/src/app/standby-schedule/dialogs/replace-dialog/replace-dialog.component.ts
@@ -25,8 +25,10 @@
   userList: Array<UserDropdownObject>;
 
   form: FormGroup = this.fb.group({
-    validFrom: ['', Validators.required],
-    validTo: ['', [Validators.required, DatepickerValidator.dateRangeTo('validFrom')]],
+    date: this.fb.group({
+      validFrom: ['', Validators.required],
+      validTo: ['', Validators.required],
+    }, { validator: [DatepickerValidator.dateRangeTo('')] }),
     validFromTime: ['', Validators.required],
     validToTime: ['', Validators.required],
     statusId: '',
diff --git a/src/app/standby-schedule/dialogs/transfer-dialog/transfer-dialog.component.html b/src/app/standby-schedule/dialogs/transfer-dialog/transfer-dialog.component.html
index 7bc6a8d..3a7e56d 100644
--- a/src/app/standby-schedule/dialogs/transfer-dialog/transfer-dialog.component.html
+++ b/src/app/standby-schedule/dialogs/transfer-dialog/transfer-dialog.component.html
@@ -17,7 +17,7 @@
 </div>
 <div class="modal-body">
   <form class="mt-3" [formGroup]="form" novalidate>
-    <div class="row">
+    <div class="row" formGroupName="date">
       <label class="form-check-label col-form-label col-md-3">
         Gültigkeit
       </label>
@@ -37,8 +37,9 @@
                 <i class="fa fa-clock-o" aria-hidden="true"></i>
               </button>
             </div>
+            <ok-error [control]="form.controls['date'].controls['validFrom']" class="w-100"></ok-error>
           </div>
-          <ok-error [control]="form.controls['validTo']"></ok-error>
+          <ok-error [control]="form.controls['date']"></ok-error>
         </div>
       </div>
       <div class="col-md-4">
@@ -57,6 +58,7 @@
                 <i class="fa fa-clock-o" aria-hidden="true"></i>
               </button>
             </div>
+            <ok-error [control]="form.controls['date'].controls['validTo']" class="w-100"></ok-error>
           </div>
         </div>
       </div>
diff --git a/src/app/standby-schedule/dialogs/transfer-dialog/transfer-dialog.component.spec.ts b/src/app/standby-schedule/dialogs/transfer-dialog/transfer-dialog.component.spec.ts
index 54645d3..824a6a3 100644
--- a/src/app/standby-schedule/dialogs/transfer-dialog/transfer-dialog.component.spec.ts
+++ b/src/app/standby-schedule/dialogs/transfer-dialog/transfer-dialog.component.spec.ts
@@ -44,11 +44,21 @@
 
   describe('decide()', () => {
     it('should prepare the data and call decide', () => {
-      component.form.patchValue({ validFrom: { day: 1, month: 1, year: 2018 }, validTo: { day: 1, month: 1, year: 2018 } });
+      component.form.patchValue({
+        date: {
+          validFrom: { day: 1, month: 1, year: 2018 },
+          validTo: { day: 1, month: 1, year: 2018 }
+        }
+      });
       component.decide(true);
     });
     it('should validate form fields if decision is true and form fields are invalid', () => {
-      component.form.patchValue({ validFrom: '', validTo: '' });
+      component.form.patchValue({
+        date: {
+          validFrom: '',
+          validTo: ''
+        }
+      });
       component.decide(true);
       expect(component.form.valid).toBeFalsy();
     });
@@ -58,7 +68,7 @@
     it('should set validFrom to current day', () => {
       const date = new Date();
       component.setDefaultDate('validFrom');
-      expect(component.form.controls.validFrom.value).toEqual({
+      expect(component.form.get('validFrom').value).toEqual({
         day: date.getDate(), month: date.getMonth() + 1, year: date.getFullYear()
       });
     });
@@ -66,7 +76,7 @@
     it('should set validTo to current day + 15 years', () => {
       const date = new Date();
       component.setDefaultDate('validTo');
-      expect(component.form.controls.validTo.value).toEqual({
+      expect(component.form.get('validTo').value).toEqual({
         day: date.getDate(), month: date.getMonth() + 1, year: date.getFullYear() + 15
       });
     });
diff --git a/src/app/standby-schedule/dialogs/transfer-dialog/transfer-dialog.component.ts b/src/app/standby-schedule/dialogs/transfer-dialog/transfer-dialog.component.ts
index 27a410e..30ee621 100644
--- a/src/app/standby-schedule/dialogs/transfer-dialog/transfer-dialog.component.ts
+++ b/src/app/standby-schedule/dialogs/transfer-dialog/transfer-dialog.component.ts
@@ -39,8 +39,10 @@
 
   createForm() {
     this.form = this.fb.group({
-      validFrom: ['', Validators.required],
-      validTo: ['', [Validators.required, DatepickerValidator.dateRangeTo('validFrom')]],
+      date: this.fb.group({
+        validFrom: ['', Validators.required],
+        validTo: ['', Validators.required],
+      }, { validator: [DatepickerValidator.dateRangeTo('')] }),
       overwrite: false
     });
   }
diff --git a/src/styles.scss b/src/styles.scss
index f5da765..c947a48 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -68,6 +68,9 @@
     min-width: 160px;
 }
 
+
+
+
 .ng-valid[required]:not(p-dropdown),
 .ng-valid.required:not(p-dropdown) {
     border-left: 5px solid #42A948;
@@ -79,6 +82,12 @@
     /* red */
 }
 
+/* for date range pickers */
+.ng-invalid:not(form):not(ngb-timepicker):not(p-dropdown) input {
+    border-left: 5px solid #a94442 !important;
+    /* red */
+}
+
 /* Fix for primeNG dropdown */
 
 p-dropdown.ng-invalid:not(form):not(div):not(ngb-timepicker)>div {