http sending nulls in PUT Request (Angular + spring jpa app)

I've a simple spring jpa rest app with angular. My API deployed in Heroku has a structure similar to this:

[{"id":1,"name":"jose","surname":"garcia","dni":"","address":"","mail":"eve.holt@reqres.in","phone":"650264663","linkedln":"ojskdfofwa","state":"","rating":"","availability":"","tags":[{"id":1,"name":"php"},{"id":1,"name":"php"}
​

So I'd like to allow users to add tags in user tag field. I'm using a PUT request for this that send the entire form of user in req body with news tags added.

This is how I take new tags with reactiveform and push to expert:

expertdetail.ts:

constructor( private formBuilder: FormBuilder,private router: Router, private expertService: ExpertsService) {this.expert= this.router?.getCurrentNavigation().extras.state.expert;
}

ngOnInit(): void {
this.formGroup = this.formBuilder.group({
tags: this.formBuilder.array([])

});



}
get tagsArray(): FormArray{
return this.formGroup.get('tags') as FormArray
}

addTag() {

const tags = this.formBuilder.group(
{
name: ['', Validators.compose([Validators.required, Validators.minLength(2), Validators.maxLength(2)])]
}
);
this.tagsArray.push(tags);

this.expert.tags.push(this.formGroup.value)
this.expertService.updateExpert(this.expert).subscribe((response) => {
if(response){
alert('etiqueta añadida con exito');
}else{
alert('Error: No Token Received');
}
}


)}


the console.log of expert seems ok,In red are the tags that user already has. In blue what I try to insert:



My method to update in expert-service:

updateExpert(expert){
return this.http.put('https://serene-wave-12377.herokuapp.com/api/experts', expert);


The call returns an OK response, but then when I go to my API I see this:

[{"id":1,"name":"jose","surname":"garcia","dni":"","address":"","mail":"eve.holt@reqres.in","phone":"650264663","linkedln":"","state":"","rating":"","availability":"","tags":[{"id":1,"name":"php"},{"id":1,"name":"php"},{"id":1,"name":"php"},{"id":1,"name":"php"},{"id":2,"name":"c++"},{"id":2,"name":"c++"},{"id":2,"name":"c++"},{"id":2,"name":"c++"},{"id":3,"name":null},{"id":4,"name":null},{"id":5,"name":null},{"id":6,"name":null},{"id":7,"name":null},{"id":8,"name":null}]}]
​

It seems like it's adding tags and generating more IDS, but name is null.

In my Spring JPA I update like this:

public Expert updateExpert(Expert expert) {
Expert updatedExpert = manager.find(Expert.class, expert.getId());
updatedExpert.setName(expert.getName());
updatedExpert.setMail(expert.getMail());
updatedExpert.setSurname(expert.getSurname());
updatedExpert.setPhone(expert.getPhone());
updatedExpert.setAvailability(expert.getAvailability());
updatedExpert.setAddress(expert.getAddress());
updatedExpert.setDni(expert.getDni());
updatedExpert.setLinkedln(expert.getLinkedln());
updatedExpert.setRating(expert.getRating());
updatedExpert.setState(expert.getState());
updatedExpert.getTags().addAll(expert.getTags());
manager.merge(updatedExpert);
return updatedExpert;
}
}


Does anyone have some idea? I've tried more combinations but nothing seems to work. I've tried with Postman and it also inserts null values always. Expert and tags have a many-to-many relationship.

Continue reading...