diff --git a/src/Web/WebSPA/Client/modules/basket/basket.component.html b/src/Web/WebSPA/Client/modules/basket/basket.component.html
index e700f622d..52aab2fe3 100644
--- a/src/Web/WebSPA/Client/modules/basket/basket.component.html
+++ b/src/Web/WebSPA/Client/modules/basket/basket.component.html
@@ -7,7 +7,7 @@
                 <div class="alert alert-warning" role="alert">&nbsp;{{errorMessage}}</div>
             </div>
         </div>
-
+ 
         <article class="esh-basket-titles row">
             <section class="esh-basket-title col-xs-3">Product</section>
             <section class="esh-basket-title col-xs-3 hidden-lg-down"></section>
@@ -25,7 +25,8 @@
                 <section class="esh-basket-item esh-basket-item--middle col-xs-3">{{item.productName}}</section>
                 <section class="esh-basket-item esh-basket-item--middle col-xs-2">$ {{item.unitPrice | number:'.2-2'}}</section>
                 <section class="esh-basket-item esh-basket-item--middle col-xs-2">
-                    <input class="esh-basket-input"
+                    <input id="quantity"
+                           class="esh-basket-input"
                            type="number"
                            min="1"
                            [(ngModel)]="item.quantity"
diff --git a/src/Web/WebSPA/Client/modules/basket/basket.component.ts b/src/Web/WebSPA/Client/modules/basket/basket.component.ts
index 879ef784b..b60731e91 100644
--- a/src/Web/WebSPA/Client/modules/basket/basket.component.ts
+++ b/src/Web/WebSPA/Client/modules/basket/basket.component.ts
@@ -1,13 +1,13 @@
-import { Component, OnInit }    from '@angular/core';
-import { Router }               from '@angular/router';
+import { Component, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
 
 import 'rxjs/Rx';
 import { Observable } from 'rxjs/Observable';
 import 'rxjs/add/observable/throw';
 
-import { BasketService }        from './basket.service';
-import { IBasket }              from '../shared/models/basket.model';
-import { IBasketItem }          from '../shared/models/basketItem.model';
+import { BasketService } from './basket.service';
+import { IBasket } from '../shared/models/basket.model';
+import { IBasketItem } from '../shared/models/basketItem.model';
 import { BasketWrapperService } from '../shared/services/basket.wrapper.service';
 
 @Component({
@@ -34,16 +34,27 @@ export class BasketComponent implements OnInit {
         this.service.setBasket(this.basket).subscribe(x => console.log('basket updated: ' + x));
     }
 
-    update(event: any) {
-        this.service.setBasket(this.basket).catch((errMessage) => {
-            this.errorMessages = errMessage.messages;
-            return Observable.throw(errMessage);
-        }).subscribe(x => console.log('basket updated: ' + x));
+    update(event: any): Observable<boolean> {
+        let setBasketObservable = this.service.setBasket(this.basket);
+        setBasketObservable
+            .subscribe(
+            x => {
+                this.errorMessages = [];
+                console.log('basket updated: ' + x);
+            },
+            errMessage => this.errorMessages = errMessage.messages);
+        return setBasketObservable;
     }
 
     checkOut(event: any) {
-        this.basketwrapper.basket = this.basket;
-        this.router.navigate(['order']);
+        this.update(event)
+            .subscribe(
+                x => {
+                    this.errorMessages = [];
+                    this.basketwrapper.basket = this.basket;
+                    this.router.navigate(['order'],
+                errMessage => this.errorMessages = errMessage.messages);
+        });
     }
 
     private calculateTotalPrice() {