使用若依框架实现省市区,级联选择下拉框
需要注意的问题,与解答
且还实现各个功能还是蛮简单的:
实现思路:
1.根据parent_id= 0 查询 省
2.根据上面一个下拉框-省的id ->作为parent_id 查询市(需要解决如何动态的显示这个下拉框)
3.根据市的id ->作为parnet_id 查询区
根据省的id值,动态的显示市的name,这就需要
前端发送一个请求(附带省的id值)给后端controller,congtroller根据regionId查询数据,并将数据返回给前端。
这种这个过程需要解决四个问题,①前端如何发送请求,给后端;②后端如何接收前端发来的数据;
③后端如何将数据发送给前端;④前端又如何解析后端发送过来的数据。
对于①,②问题的解答:
前端使用ajax异步请求,使用请求连接到后端Controller的方法,并将参数传递过去,(以json的数据类型)
当然对于查询的请求,使用GetMapping映射就可以了
对于③,④问题的解答:
后端controller中的方法前要加上映射路径,要去前端URL相同,
还要加上@ResponseBody,将返回的数据,以json的数据类型发送给前端。
数据库表
前端写法
<!-- 写下拉框-->
<div class="form-group">
<label class="col-sm-3 control-label">所在区域:</label>
<div class="col-sm-8">
<select id="province" class="form-control m-b" th:with="type=${@region.selectSysRegionNameByParentId(0)}">
<option>请选择省份</option>
<option th:each="t : ${type}" th:text="${t.name}" th:value="${t.id}"></option>
</select>
<