How To update Status Using Angular NodeJS and Mysql By Clicking On Icon Button

I want to update the status of client (from 0 to 1) by clicking on Icon (when star is lighting that means status=1 ) and i want to change 0 to 1 for the status that had status=0 The Problem that when i Clicked on the star the function cant take the Id (Réference) To compete the fucntion BTW the Backend (Nodejs ,Mysql ) Is working well .

enter image description here This is My update function Service

 constructor(
        private _httpClient: HttpClient
    )
product: Product;     //this bring the model 
apiURL = 'http://localhost:5000/gestion';
 httpOptions = {
        headers: new HttpHeaders({
          'Content-Type': 'application/json'
        })
      }  
    updateflagses(id, product): Observable<Product> {
        return this._httpClient.put<Product>(this.apiURL + '/updatee/' + id, 
        JSON.stringify(this.product), this.httpOptions)
        .pipe(
          retry(1),
          catchError(this.handleError)
        )
      }

This My type Script code that contain the update function

  
    
    // Update Client data
  updateeea() {
    if(window.confirm('Êtes-vous sûr de vouloir mettre à jour? Cette action est non réversible')){
      this._ecommerceProductsService.updateflagses(this.id, this.product).subscribe(data => {
        this.router.navigate(['apps/e-commerce/products'])
      })
    }
  } 

And this is The HTML part of The button of star that I clicked On

<ng-container matColumnDef="status">
                    <mat-header-cell *matHeaderCellDef fxHide mat-sort-header fxShow.gt-md>Etat</mat-header-cell>
                    <mat-cell *matCellDef="let product" fxHide fxShow.gt-md>
                        <button mat-icon-button   aria-label="Toggle star"   >
                            <mat-icon class="amber-fg" *ngIf="product.status===1" >star</mat-icon>
                            <mat-icon class="secondary-text" *ngIf="product.status===0"  (click)="updateeea(product)" >star_border</mat-icon>
                        </button>
                    </mat-cell>
                </ng-container>

And this is the Error Of Nodejs Side enter image description here

Answer

I will assume that the id is a property inside the product object.

You are passing the product but don’t use it inside the updateeea function. It should be something similar to this:

updateeea(product: Product) {
  if(window.confirm('Êtes-vous sûr de vouloir mettre à jour? Cette action est non réversible')){
    this._ecommerceProductsService.updateflagses(product.id, product)
      .subscribe(data => {
        this.router.navigate(['apps/e-commerce/products'])
      })
  }
} 

Leave a Reply

Your email address will not be published. Required fields are marked *