How to call url which depends on input in Thymeleaf? - html

Question

I have a form in Thymeleaf in which there is a drop down list and a button. I want to call an URL when the button is clicked which depends on the value of drop down selected. From the dropdown, serviceId is selected and then the URL also uses serviceId. How do I do this?
<form action="#" th:action="#{/heart2heart/format/{serviceId}}" method="get" role="form">
<div class="form-group">
<select th:field="*{serviceId}" class="form-control">
<option th:each="service : ${services}"
th:value="${service.id}"
th:text="${service.description}">Customer Service</option>
</select>
</div>
<div class="form-group">
<button type="button" name="addRow" th:text="#{button.download}"
class="btn btn-primary btn-md">Download</button>
</div>
</form>

Answer 1

This is a combination of javascript/jquery and integrating it into your form.
So first you need to set some id's:
<select id="someidyougaveit" th:field="*{serviceId}" class="form-control">
//code
</select>
<form id="yourform" action="#" th:action="#{/heart2heart/format/{serviceId}}" method="get" role="form">
// code
</form>
Then using Javascript change the action after obtaining the value:
var frm = document.getElementById('yourform');
if(frm) {
frm.action = 'yoururl'+$("#someidyougaveit").val();
}