Я создаю JPA-приложение Spring Boot с интерфейсом Thymeleaf и Bootstrap 4. Приложение используется для управления набором пользовательских навыков, которые организованы по категориям.
Мне нужно создать каскадный выпадающий список в форме, где параметры во втором раскрывающемся списке (навыки, например, Java, Python) зависят отвыбор сделан в первом выпадающем списке (категория например Языки программирования). Эта форма в конечном итоге будет использоваться для поиска пользователей, обладающих этими навыками.
В моем контроллере я создаю карту, ключом которой является категория, а значением - список связанных навыков: -
Map<String, List<Skill>> skillsMap = new HashMap();
Я заполняю эту карту и добавляю ее в свою модель: -
model.addAttribute("skillsMap", skillsMap);
В моем представлении в шаблоне Thymeleaf я затем извлекаю эту карту из модели и начинаю строить формус его помощью.
<form id="skillsForm" th:object="${skillsMap}" th:action="@{/skills/search}" method="post"
class="form-horizontal">
<div class="form-group ">
<div class="input-group">
<div class="input-group-addon"><i class="fa"></i></div>
<select id="categorySelector">
<option value="NONE">----Select----</option>
<option th:each="entry : ${skillsMap.entrySet()}" th:value="${entry.key}"
th:text="${entry.key}">
</option>
</select>
</div>
</div>
<input type="submit" class="btn btn-primary" value="Search">
</form>
Я могу успешно заполнить первый раскрывающийся список категориями своих навыков, но, будучи новичком в интерфейсных технологиях, я полностью нарисовал пробел относительно того, как действовать и заполнять второй раскрывающийся список. box.
Мне нужно поведение, которое заключается в том, что после выбора категории в первом раскрывающемся списке отображается второе раскрывающееся меню с навыками из этой категории в качестве параметров. Любое руководство будет приветствоваться и спасибо за чтение моего вопроса