I want to create a drop-down list with countries and the second drop-down list with cities, which depends on selected value in the first list. And the list of cities should be changed dynamically.
In the view (Thymeleaf) I have a Map<CountryModel, Set<RegionModel>> from controller. CountryModel's name should be shows in the second drop-down list, and Set should be shows in the second(dependent) drop-down list.
Here I create first drop-down list:
<tr>
<td th:text="#{country}"/>
<td>
<div class="form-group">
<select th:field="*{transferRequestModel.country}" class="form-control" id="country">
<option th:each="country : ${transferModel.countries}"
th:value="${country}"
th:text="${country.key.countryName}">Wireframe
</option>
</select>
</div>
</td>
</tr>
So how to create second drop-down list which depends on selected country in the first list?