Question

我很难在春季4用百里香开发级联下拉。

以下是我的情景：

我有两个下拉状态，如州和城市。根据州选择，我需要在该州的相应城市填充城市下拉列表。

我正在使用Spring boot，spring 4和thymeleaf模板进行查看。

提前致谢。

Answer 1

您想下拉列表/列表选择器吗？

我现在可以帮你吗？请阅读这篇文章。

选择字段包含两部分：<select>标记及其嵌套的<option>标记。创建此类字段时，只有<select>代码必须包含th:field属性，但嵌套th:value代码中的<option>属性非常重要，因为它们会提供了解当前所选选项的方法（与非布尔复选框和单选按钮类似）。

让我们重新构建类型字段作为下拉列表选择：

<select th:field="*{type}">
  <option th:each="type : ${allTypes}" 
          th:value="${type}" 
          th:text="#{${'seedstarter.type.' + type}}">Wireframe</option>
</select>

您也可以查看Thymeleaf Website

Answer 2

您可以使用appelsiini chained select来实现级联下拉列表。

<强> template.html

<select th:field="*{state}">
    <option value="0">--</option>
    <option th:each="state : ${states}" th:value="${state.stateId}" th:text="${state.name}">Florida</option>
</select>
<select th:field="*{city}">
    <option value="0">--</option>
</select>

<script type="text/javascript">
    $("#city").remoteChained({
        parents: "#state",
        url: /*[[@{/getStateCityValues}]]*/ ""
    });
</script>

<强> Controller.java

@PostMapping("/getStateCityValues")
public @ResponseBody
Map<String, String> getStateCityValues(@RequestParam("state") Integer state) {
    Map<String, String> cityValues = new HashMap<>();

    List<City> cities = cityService.getStateCities(state);

    for(City city : cities){
        cityValues.put(String.valueOf(city.getCityId()), city.getName());
    }

    return cityValues;  
}

如何使用百里香叶在春季4开发级联下拉

2 个答案:

让我们重新构建类型字段作为下拉列表选择：