How to pass some data from current html page to controller on button click as an argument for another api call in springboot thymleaf?

Question

I have one html page which contains some data. There is also one button on the same page, when we click that button a new api is called. I want to pass some data from the displaying page as a RequestParam or RequestBody to another api on button click. I am new to thymleaf and UI technology. Could someone please suggest how should I achieve this?

the main api is: http:localhost:8080/home

• There is some data on this page.
• Also we have one button on this page.

I want to send some of the data which is being displayed on page to the another api which gets called after clicking a button.

Api called on button click: http:localhost:8080/data/export (GET api)

Answer 1

Example of sending a string as a RequestParam from a thymeleaf page.

@GetMapping("/data/export")
public String exportData(@RequestParam(name = "myData") String myData) {
    // do stuff
}

---

<form action="#" th:action="@{/data/export}" th:method="get">
    <input type="hidden" name="myData" th:value="*{myData}" />
    <button type="submit" id="submitButton">Button</button>
</form>

There will need to be an object called "myData" on your page in order for the input to have the right value. If you're referencing a property from an object you'll need to include th:object in the form. In this example it would look like so

<form action="#" th:action="@{/data/export}" th:object="myObject" th:method="get">
    <input type="hidden" name="myData" th:value="*{myData}" />
    <button type="submit" id="submitButton">Button</button>
</form>

Where myObject has a property called myData

Reference for passing data

Reference for the button