fixed error message on command modal shows everytime

projects/poweredsoft/ngx-bootstrap/src/lib/command-modal/command-modal/command-modal.component.html

@@ -7,7 +7,7 @@
 <div class="modal-body">
     <ng-container [ngTemplateOutlet]="template"
         [ngTemplateOutletContext]="{ $implicit: commandModel, loading: loading }"></ng-container>
-    <div *ngIf="validationMessage" class="alert alert-danger mt-2" style="white-space: pre-wrap">{{validationMessage}}</div>
+    <div *ngIf="hasError" class="alert alert-danger mt-2" style="white-space: pre-wrap">{{validationMessage}}</div>
 </div>
 <div class="modal-footer">
     <button type="button" class="btn btn-light" (click)="modalRef.hide()"

projects/poweredsoft/ngx-bootstrap/src/lib/command-modal/command-modal/command-modal.component.ts

@@ -25,6 +25,7 @@ export class CommandModalComponent implements OnInit, OnDestroy {
   validationMessage:string ;
   btnClass:string;
   successEmitter: EventEmitter<any>; 
+  hasError: boolean;
 
   private _notifyMessage: Subscription;
   private _validationError: Subscription;
@@ -53,8 +54,6 @@ export class CommandModalComponent implements OnInit, OnDestroy {
   }
 
   onSubmit(){
-    
-
     this.loading = true;
     this.validationMessage = null;
 
@@ -67,10 +66,11 @@ export class CommandModalComponent implements OnInit, OnDestroy {
       .subscribe(commandResult => {
         if (this.refreshOnSuccess)
           this.dataSource.refresh();
-
+        this.hasError = false;
         this.modalRef.hide();
         this.successEmitter.emit(commandResult);
       }, fail => {
+        this.hasError = true;
         // you do not want to close on failure.. so just ignore..
       });
   }

src/app/grid-filter&sorting-demo/grid-filter-demo/grid-filter-demo.component.html

@@ -53,20 +53,12 @@
         <ng-container *psDataGridCell="let model">
             <div class="btn-group">
                 <button class="btn-info btn" psbxCommandModal [commandTitle]="'Change ' + model.name + ' name'"
-                commandText="Update" [dataSource]="merchantDataSource" command="changeMerchant" [model]="model"
+                    commandText="Update" [dataSource]="merchantDataSource" command="changeMerchant" [model]="model"
-                [template]="theModal">Change</button>
+                    [template]="theModal">Change</button>
-                <button class="btn-danger btn" 
+                <button class="btn-danger btn" psbxCommand [dataSource]="merchantDataSource" command="removeMerchant"
-                psbxCommand 
+                    [model]="model" [confirm]="true" yesClass="warning" noClass="secondary" noText="Cancel Delete"
-                [dataSource]="merchantDataSource" 
+                    yesText="Delete It"
-                command="removeMerchant" 
+                    confirmMessage="Are you sure you want to delete this merchant?">RemoveIt</button></div>
-                [model]="model" 
-                [confirm]="true"
-                yesClass="warning"
-                noClass = "secondary"
-                noText = "Cancel Delete"
-                yesText = "Delete It"
-                confirmMessage="Are you sure you want to delete this merchant?"
-                >RemoveIt</button></div>
 
         </ng-container>
     </ng-container>
@@ -78,17 +70,16 @@
 
 <ng-template #theModal let-command let-loading="loading">
     <label for="name">Name</label>
-    <input type="text" required  [(ngModel)]="command.name" placeholder="Enter a merchant name"
+    <input type="text" required [(ngModel)]="command.name" placeholder="Enter a merchant name" class="form-control">
-        class="form-control">
     <label for="address">Address</label>
-    <input type="text" required  [(ngModel)]="command.address"
+    <input type="text" required [(ngModel)]="command.address" placeholder="Enter the merchant's address"
-        placeholder="Enter the merchant's address" class="form-control">
+        class="form-control">
     <label for="address">Priority</label>
-    <input type="number" required  [(ngModel)]="command.ordering"
+    <input type="number" required [(ngModel)]="command.ordering" placeholder="Enter the merchant's Priority"
-        placeholder="Enter the merchant's Priority" class="form-control">
+        class="form-control">
     <label for="address">Priority</label>
-    <input type="date" required  [(ngModel)]="command.openDate"
+    <input type="date" required [(ngModel)]="command.openDate" placeholder="Enter the merchant's Priority"
-        placeholder="Enter the merchant's Priority" class="form-control">
+        class="form-control">
 
 </ng-template>
 
@@ -100,6 +91,3 @@
         <button type="button" class="btn btn-primary">No</button>
     </div>
 </ng-template>
-
-
-