How to send data from thymeleaf HTML page to the MVC spring boot controller?

Question

I am new to thymeleaf and spring and I am trying to send simple input data from the index page to the controller, So I created an object Exchange shown below where it will contain the fields of the input to be handled. The problem is that i keep getting an error shown in the picture

here is my Exchange object

package myprivate.work.MyCurrencyConverter.model;
public class Exchange
{
    private String fromcurrency;
    private String tocurrency;
    private double amount;
    public Exchange(){
       super();
    }
    public Exchange(String fromcurrency, String tocurrency, double amount) {
        super();
        this.fromcurrency = fromcurrency;
        this.tocurrency = tocurrency;
        this.amount = amount;
    }
    public String getFromcurrency() {
        return fromcurrency;
    }
    public void setFromcurrency(String fromcurrency) {
        this.fromcurrency = fromcurrency;
    }
    public String getTocurrency() {
        return tocurrency;
    }
    public void setTocurrency(String tocurrency) {
        this.tocurrency = tocurrency;
    }
    public double getAmount() {
        return amount;
    }
    public void setAmount(double amount) {
        this.amount = amount;
    }
}

and this is the form i have in the index

<form th:action="@{/newexchange}" th:object="${exchange}" method='POST'>
    <p>Select From Currency:</p>
    <p>
        <select th:field="*{fromcurrency}"> <!-- this is line 12 -->
            <option th:value="sek">SEK</option>
            <option th:value="eur">EUR</option>
            <option th:value="usd">USD</option>
            <option th:value="jpy">JPY</option>
        </select>
    </p>
    <p>Select To Currency:</p>
    <p>
        <select th:field="*{tocurrency}">
            <option th:value="sek">SEK</option>
            <option th:value="eur">EUR</option>
            <option th:value="usd">USD</option>
            <option th:value="jpy">JPY</option>
        </select>
    </p>
    <p class="form"><label>Insert New Rate:</label><input type="number" th:field="*{amount}"/>
    </p>
    <p><input name="Convert" type="submit" value="submit"/></p>
</form>

and in my controller

@RequestMapping(method = RequestMethod.POST , value = "/newexchange")
public String toExchange(Exchange exchange, BindingResult result)
{
    return "..ok..";
}

here is the

Answer 1

You have to tell Thymeleaf which object you're referring to. You'll have to pass a ModelAttribute to the page so that Thymeleaf knows which object to bind the properties with.

Using the asterisk syntax *{...} evaluates the expression on selected object on th:object.

Something like this:

// this method need to show your exchange page
@GetMapping("/exchange")
public String handleGetRegisterRequest(
        @ModelAttribute Exchange exchange) { // your object (Thymeleaf will receive this to bind with the parameters you pass)
    return "exchange"; // the name of your page which contains the exchange informations
}