Fix issue no cardtpyeid submitted in SPA

Fix issue multiple order creation. Now the create order button is disabled until the request is processed

src/Web/WebSPA/Client/modules/orders/orders-new/orders-new.component.html

@@ -105,7 +105,7 @@
                 <div class="col-md-9">
                 </div>
                 <div class="col-md-2">
-                    <button type="submit" class="btn esh-orders_new-placeOrder" [disabled]="!newOrderForm.valid">[ Place Order ]</button>
+                    <button type="submit" class="btn esh-orders_new-placeOrder" [disabled]="!newOrderForm.valid || isOrderProcessing">[ Place Order ]</button>
                 </div>
             </div>
         </section>

src/Web/WebSPA/Client/modules/orders/orders-new/orders-new.component.ts

@@ -1,4 +1,5 @@
-import { Component, OnInit }                        from '@angular/core';
+import { Component, OnInit } from '@angular/core';
+import { Observable } from 'rxjs/Observable';
 import { OrdersService }                            from '../orders.service';
 import { IOrder }                                   from '../../shared/models/order.model';
 import { BasketWrapperService }                     from '../../shared/services/basket.wrapper.service';
@@ -13,6 +14,7 @@ import { Router }                                   from '@angular/router';
 })
 export class OrdersNewComponent implements OnInit {
     private newOrderForm: FormGroup;  // new order form
+    private isOrderProcessing: Boolean;
     private order: IOrder;
 
     constructor(private service: OrdersService, fb: FormBuilder, private router: Router, private basketEvents: BasketWrapperService) {
@@ -39,16 +41,24 @@ export class OrdersNewComponent implements OnInit {
         this.order.state = this.newOrderForm.controls['state'].value;
         this.order.country = this.newOrderForm.controls['country'].value;
         this.order.cardnumber = this.newOrderForm.controls['cardnumber'].value;
+        this.order.cardtypeid = 1;
         this.order.cardholdername = this.newOrderForm.controls['cardholdername'].value;
         this.order.cardexpiration = new Date(20 + this.newOrderForm.controls['expirationdate'].value.split('/')[1], this.newOrderForm.controls['expirationdate'].value.split('/')[0]);
         this.order.cardsecuritynumber = this.newOrderForm.controls['securitycode'].value;
 
-        this.service.postOrder(this.order).subscribe(res => {
+        this.service.postOrder(this.order)
+            .catch((errMessage) => {
+                this.isOrderProcessing = false;
+                return Observable.throw(errMessage); 
+            })
+            .subscribe(res => {
             // this will emit an observable. Basket service is subscribed to this observable, and will react deleting the basket for the current user. 
             this.basketEvents.orderCreated();
-
+            
             this.router.navigate(['orders']);
         });
+
+        this.isOrderProcessing = true;
     }
 }