Clé étrangère ne s'enregistre pas en db (Angular)

Albius
Javascript
Javascript NodeJS

Bonjour à tous,
J'ai un petit soucis que je vous expose mon problème en espèrant pouvoir trouver une solution avec votre aide!

Ce que je souhaite:

J'aimerais que la valeur de "site_id" de mon formulaire soit bien ajouté en db dans la table "numberplate" .

Ce que j'obtiens:

Un enregistrement en db qui ne contient pas "site_id" dans la table "numberplate".

Ma partie html du formulaire (select)

    <select class="custom-select" formControlName="site_id">
      <option [value]="null" selected disabled>Select a site</option>
      <option *ngFor="let site of sitesList" [value]="site.site_id">{{site.name}} </option>
    </select>

Les valeurs obtenues dans la console lors du submit:

    Form value : 
    {numberplate_id: null, site_id: '4e9e2710-0c06-45f1-909e-36299f1b4780', num_plate: '1-HBO-999', dop: '2022-07-20', active: true}
    active: true
    dop: "2022-07-20"
    num_plate: "1-HBO-999"
    numberplate_id: null
    site_id: "4e9e2710-0c06-45f1-909e-36299f1b4780"

Frontend (numberplate_create.components.ts)

    export class NumberplateCreateComponent implements OnInit {

      errorMsg: string = '';
      successMsg: string = '';
      getParamId = this.activatedRoute.snapshot.paramMap.get('id');
      sitesList: Site[] = [];
      formGroup!: FormGroup;

      constructor(private apiService: ApiService, private activatedRoute: ActivatedRoute) {
      }

      ngOnInit(): void {
        this.getSitesList();
        this.initForm();
      }

      private initForm(): void {
        this.formGroup = new FormGroup({
          'site_id': new FormControl(),
          'num_plate': new FormControl('', Validators.required),
          'dop': new FormControl(''),
          'active': new FormControl(true)
        });

      }

      create(): void {
        if (this.formGroup.valid) {
          const payload: NumberplateCreatePayload = this.formGroup.value;
          console.log(payload)
          this.apiService.createNumberplate(payload).subscribe((response: ApiResponse) => {
            if (response.result) {
              this.formGroup.reset();
              this.successMsg = response.code;
            }
          })
        } else {
          this.errorMsg = 'All fields are required';
        }
      }

      getSitesList() {
        this.apiService.getAllSite().subscribe((response: ApiResponse) => {
          this.sitesList = response.data;
          if (this.sitesList == null) {
            this.errorMsg = response.code;
          }
        })
      }

    }

Frontend (api.service.ts)

      createNumberplate(data: any): Observable<ApiResponse> {
        return this.http.post(`${this.baseUrl}/numberplate/create`, data)
          .pipe(
            map(response => response as ApiResponse)
          );
      }

Backend (NumberplateCreatePayload.java)

    public class NumberplateCreatePayload {
        private String num_plate;
        private Date dop;
        private Boolean active;
        private Site site;
    }

Backend (Numberplate.java)

    public class Numberplate {
        @Id
        @GeneratedValue(generator = "uuid2")
        @GenericGenerator(name = "uuid2", strategy = "uuid2")
        @Column(columnDefinition = "BINARY(16)")
        private UUID numberplate_id;
        private String num_plate;

        @DateTimeFormat(pattern = "dd/MM/yyyy")
        private Date dop;
        private Boolean active;

        @ManyToOne(fetch = FetchType.EAGER, cascade = {CascadeType.MERGE})
        @JoinColumn(name = "site_id")
        private Site site;
    }

Lors de la création via Postman je n'ai aucune erreur, l'enregistrement est bien là en entier.

Merci pour votre aide!

Aucune réponse