html 请求option列表数据 选中取回

前言：现在option去请求ajax 来获取列表数据，然后在通过选中期中列表来选择一条数据传输给后台

模板themleaf

页面一进来就加载 请求部门列表

$(document).ready(function () {
    getDepts();
});

该表单是form表单用name提交数据

ajax请求如下

function getDepts() {
    util.ajax("/setting/dept/findDeptList", {}, function (result) {
        if (result.code == 0) {
            var deptList = result.dtoList;
            for (var i = 0; i < deptList.length; i++) {
                var deptName = deptList[i].deptName;
                var deptId = deptList[i].deptId;
                $('#selectDept').append('<option name="applyDeptId" value="' + deptId + '" class="option-dept">' + deptName + '</option>');
                $('.received-selectDept').append('<option name="receiveDeptId" value="' + deptId + '" class="option-dept" required="required">' + deptName + '</option>');

            }
        }
    })
}

此时整个form中已经有这个数据了对于form表单就是List

 <div class="box-body-item" id="tb1" required="required">
                                <p>接收部门</p>
                                <select name="receiveDeptId" class="received-selectDept" th:field="*{receiveDeptId}">
                                    <!--<option  class="option-dept"-->
                                            <!--name="receiveDeptId"></option>-->
                                    <option th:each="List:${dtoList}" th:value="${List.deptId}" th:text="${List.deptName}">全部园区</option>
                                </select>

                            </div>

提交到后台此字段，通过List.deptId 和List.deptName来提交数据给后台的字段receiveDeptId

如果利用模板单纯的知识想要获取数据

则form表单对应action等要写好，然后利用模板遍历接口

@RequestMapping("/setting/dept/findDeptById")
    @ResponseBody
    public RestResponse findDeptById(@ModelAttribute DeptBo deptBo){
        RestResponse result = new RestResponse();
        deptBo = deptService.findDeptByIdService(deptBo.getDeptId());
        result.put("deptBo",deptBo);
        return result;
    }

<select name="receiveDeptId" class="received-selectDept" th:field="*{receiveDeptId}">
                                    <!--<option  class="option-dept"-->
                                            <!--name="receiveDeptId"></option>-->
                                    <option th:each="List:${dtoList}" th:value="${List.deptId}" th:text="${List.deptName}">全部园区</option>
                                </select>

总结一个是获取之后再去得到，一个是单纯得到，千万不要弄错了