How to map html form data to a Spring Boot model containing a composite key?

I have popup form in my html that looks like this:

<dialog id="favDialog">
    <div id="feedback"></div>
    <form id="add_watchlist_symbol_form">
        <label for="symbol">Enter Symbol:</label>
        <input type="text" class="form-control" id="symbol" placeholder="SYMB"/><br><br>
        <button type="submit" class="btn btn-default" id="add-watchlist-symbol-btn">Add</button>
    </form>
    <button id="cancelBtn" value="cancel">Cancel</button>
</dialog>

The dialog pops up successfully when I click a button.

The dialog contains a button called Add. It's click event is handled by javascript which sends an ajax POST request containing the form field values to Spring Boot like this:

function submit_watchlist_symbol() {
    console.log("Im in submit_watchlist_symbol");
    var formData = {
        symbol: $("#symbol").val(),
        name: "My Portfolio"
    }

     //$("#btn-search").prop("disabled", true);

    $.ajax({
        type: "POST",
        contentType: "application/json",
        url: "/api/v1/AddSymbolToWatchlist",
        data: JSON.stringify(formData),
        dataType: 'json',
        success: function (result) {
            if(result.status=="Done") {
                $('#feedback').html(result.data.symbol +" added.");
            }
            else {
                $('#feedback').html("<strong>Error</strong>");
            }
            console.log("ERROR: ",e);
        },
        error: function (e) {
            alert("Error!")                    
            console.log("ERROR: ",e);
        }
    });

    // Reset FormData after Posting
    resetData();
}

When I click that button I get Spring Boot error:

> Resolved
> [org.springframework.http.converter.HttpMessageNotReadableException:
> JSON parse error: null; nested exception is
> com.fasterxml.jackson.databind.JsonMappingException: N/A at [Source:
> (PushbackInputStream); line: 1, column: 11] (through reference chain:
> net.tekknow.moneymachine.model.Watchlist["symbol"])]

I suspect the form data is not being mapped correctly to the Watchlist.java model due to the model containing a composite key, like this:

@Entity
@Table(name = "watchlist")
public class Watchlist {
	@EmbeddedId
	public WatchlistId watchlistId;
	
 
	public String getSymbol() {
		return watchlistId.getSymbol();
	}
	public void setSymbol(String symbol) {
		watchlistId.setSymbol(symbol);
	}

	public String getName() {
		return watchlistId.getName();
	}
	public void setName(String watchlistName) {
		watchlistId.setName(watchlistName);
	}
	
	public String toString() {
		return "watchlist:symbol=" +getSymbol() +", name="+getName();
	}
}

where watchlistId contains the symbol and name, like this:

@Embeddable
public class WatchlistId implements Serializable {
	@Column(name="symbol")
	private String symbol;
	
	@Column(name="name")
	private String name;
	
	WatchlistId() {		
	}

	WatchlistId(String symbol, String name) {
		this.symbol = symbol;
		this.name = name;
	}
	
	public String getSymbol() {
		return symbol;
	}
	public void setSymbol(String symbol) {
		this.symbol = symbol;
	}

	public String getName() {
		return name;
	}
	public void setName(String name) {
		this.name = name;
	}
	
    @Override
    public boolean equals(Object o) {
        if (this == o) return true;
 
        if (o == null || getClass() != o.getClass()) return false;
 
        WatchlistId that = (WatchlistId) o;
        return Objects.equals(symbol, that.symbol) && Objects.equals(name, that.name);
    }
 
    @Override
    public int hashCode() {
        return Objects.hash(symbol, name);
    }	
}

Here is the Spring Boot controller that handles the request:

@PostMapping("/AddSymbolToWatchlist")
@ResponseBody
public AddWatchlistSymbolResponse addSymbolToWatchlist(@RequestBody Watchlist watchlist){
	System.out.println("made it to AddWatchlistSymbolResponse");
    // Create Response Object
	AddWatchlistSymbolResponse response = new AddWatchlistSymbolResponse("Done", watchlist);
    return response;
}

The AddWatchlistSymbolResponse class looks like this:

public class AddWatchlistSymbolResponse {
	  private String status;
	  private Object data;
	  
	  public AddWatchlistSymbolResponse(){
	    
	  }
	  
	  public AddWatchlistSymbolResponse(String status, Object data){
	    this.status = status;
	    this.data = data;
	  }
	 
	  public String getStatus() {
	    return status;
	  }
	 
	  public void setStatus(String status) {
	    this.status = status;
	  }
	 
	  public Object getData() {
	    return data;
	  }
	 
	  public void setData(Object data) {
	    this.data = data;
	  }
}

Suggestions?

I figured it out. I changed the controller to this:

@PostMapping(value = "/AddSymbolToWatchlist")
@ResponseBody
public WatchlistIdResponse addSymbolToWatchlist(@RequestBody WatchlistId watchlistId){
	System.out.println("made it to AddWatchlistSymbolResponse");
	watchlistService.addSymbolToWatchlist(watchlistId);
    // Create Response Object
	WatchlistIdResponse response = new WatchlistIdResponse("Done", watchlistId);
    return response;
}

And created a separate response for WatchlistId called WatchlistIdResponse.java:

package net.tekknow.moneymachine.model;

public class WatchlistIdResponse {
	private String status;
	private Object data;

	public WatchlistIdResponse() {

	}

	public WatchlistIdResponse(String status, Object data) {
		this.status = status;
		this.data = data;
	}

	public String getStatus() {
		return status;
	}

	public void setStatus(String status) {
		this.status = status;
	}

	public Object getData() {
		return data;
	}

	public void setData(Object data) {
		this.data = data;
	}
}

The reason is that the Watchlist class contains only the WatchlistId property. WatchlistId contains the symbol and name properties that make up the composite index.