diff --git a/web/src/app/administration/workbasket/details/workbasket-details.component.html b/web/src/app/administration/workbasket/details/workbasket-details.component.html
index 7cd312ca7..dc6fd4a51 100644
--- a/web/src/app/administration/workbasket/details/workbasket-details.component.html
+++ b/web/src/app/administration/workbasket/details/workbasket-details.component.html
@@ -6,17 +6,17 @@
                 <a (click)="backClicked()">
                     <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>Back</a>
             </li>
-            <li role="presentation" class="active" (click)="seclectTab('information')" [ngClass]="{'active':tabSelected === 'information'}">
+            <li role="presentation" class="active" (click)="selectTab('information')" [ngClass]="{'active':tabSelected === 'information'}">
                 <a aria-controls="work baskets" role="tab" aria-expanded="true">
                     Information</a>
             </li>
-            <li role="presentation" (click)="seclectTab('accessItems')" [ngClass]="{
+            <li role="presentation" (click)="selectTab('accessItems')" [ngClass]="{
                 'disabled': action ==='CREATE',
                 'active':tabSelected === 'accessItems'}">
                 <a aria-controls="Acccess" role="tab" aria-expanded="true">
                     Access</a>
             </li>
-            <li role="presentation" (click)="seclectTab('distributionTargets')" [ngClass]="{
+            <li role="presentation" (click)="selectTab('distributionTargets')" [ngClass]="{
                 'disabled': action ==='CREATE',
                 'active':tabSelected === 'distributionTargets'}">
                 <a aria-controls="distribution targets" role="tab" data-toggle="tab" aria-expanded="true">
diff --git a/web/src/app/administration/workbasket/details/workbasket-details.component.ts b/web/src/app/administration/workbasket/details/workbasket-details.component.ts
index a046183d0..8eb7991d6 100644
--- a/web/src/app/administration/workbasket/details/workbasket-details.component.ts
+++ b/web/src/app/administration/workbasket/details/workbasket-details.component.ts
@@ -4,10 +4,12 @@ import { Subscription } from 'rxjs';
 
 import { Workbasket } from 'app/models/workbasket';
 import { ACTION } from 'app/models/action';
+import { ErrorModel } from '../../../models/modal-error';
 
 import { WorkbasketService } from 'app/services/workbasket/workbasket.service'
 import { MasterAndDetailService } from 'app/services/masterAndDetail/master-and-detail.service'
 import { DomainService } from 'app/services/domain/domain.service';
+import { ErrorModalService } from '../../../services/errorModal/error-modal.service';
 
 
 @Component({
@@ -37,7 +39,8 @@ export class WorkbasketDetailsComponent implements OnInit, OnDestroy {
 		private route: ActivatedRoute,
 		private router: Router,
 		private masterAndDetailService: MasterAndDetailService,
-		private domainService: DomainService) { }
+		private domainService: DomainService,
+    private errorModalService: ErrorModalService) { }
 
 
 
@@ -63,7 +66,7 @@ export class WorkbasketDetailsComponent implements OnInit, OnDestroy {
 				this.action = ACTION.COPY;
 				this.workbasket.key = undefined;
 				this.workbasketCopy = this.workbasket;
-				id = undefined
+				id = undefined;
 				this.getWorkbasketInformation(id, this.selectedId);
 			}
 
@@ -82,7 +85,7 @@ export class WorkbasketDetailsComponent implements OnInit, OnDestroy {
 		this.router.navigate(['./'], { relativeTo: this.route.parent });
 	}
 
-	seclectTab(tab) {
+	selectTab(tab) {
 		this.tabSelected = this.action === ACTION.CREATE ? 'information' : tab;
 	}
 
@@ -110,7 +113,10 @@ export class WorkbasketDetailsComponent implements OnInit, OnDestroy {
 				this.workbasket = workbasket;
 				this.requestInProgress = false;
 				this.checkDomainAndRedirect();
-			});
+			}, err => {
+        this.errorModalService.triggerError(
+          new ErrorModel('An error occurred while fetching the workbasket', err));
+      });
 		}
 	}
 
diff --git a/web/src/app/workplace/taskdetails/taskdetails.component.ts b/web/src/app/workplace/taskdetails/taskdetails.component.ts
index 4b31747ad..357decf4d 100644
--- a/web/src/app/workplace/taskdetails/taskdetails.component.ts
+++ b/web/src/app/workplace/taskdetails/taskdetails.component.ts
@@ -6,6 +6,8 @@ import { TaskService } from 'app/workplace/services/task.service';
 import { RemoveConfirmationService } from 'app/services/remove-confirmation/remove-confirmation.service';
 
 import { Task } from 'app/workplace/models/task';
+import {ErrorModel} from '../../models/modal-error';
+import {ErrorModalService} from '../../services/errorModal/error-modal.service';
 
 @Component({
   selector: 'taskana-task-details',
@@ -18,10 +20,12 @@ export class TaskdetailsComponent implements OnInit, OnDestroy {
 
   private routeSubscription: Subscription;
 
+
   constructor(private route: ActivatedRoute,
     private taskService: TaskService,
     private router: Router,
-    private removeConfirmationService: RemoveConfirmationService) {
+    private removeConfirmationService: RemoveConfirmationService,
+    private errorModalService: ErrorModalService) {
   }
 
   ngOnInit() {
@@ -36,6 +40,9 @@ export class TaskdetailsComponent implements OnInit, OnDestroy {
     this.taskService.getTask(id).subscribe(task => {
       this.requestInProgress = false;
       this.task = task;
+    }, err => {
+      this.errorModalService.triggerError(
+        new ErrorModel('An error occurred while fetching the task', err));
     });
   }