基于若依框架，班级下拉框查询

最新推荐文章于 2024-08-19 23:45:00 发布

平平常常一般牛

最新推荐文章于 2024-08-19 23:45:00 发布

阅读量3.7k

点赞数

分类专栏： Ruoyi

折扇戏美人

本文链接：https://blog.csdn.net/CSDN_java1005/article/details/110091222

版权

Ruoyi 专栏收录该内容

6 篇文章 10 订阅

订阅专栏

基于若依框架，班级下拉框查询

在这里插入图片描述
第一步：先在后端查询出班级表中的内容，就是在xml配置项中重新编写个SQL语句，用于查询

 <select id="selectSysClassAll" parameterType="Integer" resultMap="SysClassResult">
        <include refid="selectSysClassVo"/>
    </select>

在这里插入图片描述
下图目录中的代码，我就不再在此编写了

第二步：我们将我们查询的数据通过映射到前端。我们通过selectSysClassAll()方法调用我们编写的SQL语句，进行班级表的查询，将我们获取的数据通过“sysClass”字段映射到我们的前端。

控制层：添加
在这里插入图片描述

   @GetMapping("/add")
    public String add(ModelMap mmp)
    {
        mmp.put("sysClass",classService.selectSysClassAll());
        return prefix + "/add";
    }

控制层：修改
在这里插入图片描述

@GetMapping("/edit/{studentId}")
    public String edit(@PathVariable("studentId") Long studentId, ModelMap mmap)
    {
        mmap.put("student", studentService.selectStudentById(studentId));
        mmap.put("sysClass",classService.selectSysClassAll());
        return prefix + "/edit";
    }

前端接收从后端获取的数据通过each 将数据循环出来
先引入select2

<th:block th:include="include :: select2-css" />

add ：添加界面下拉框的样式

	<div class="form-group">
				<label class="col-xs-2 control-label">班级名称：</label>
				<div class="col-xs-2">
					<select id="sysClass" class="form-control select2-multiple" >
						<option th:each="sysClass:${sysClass}" th:value="${sysClass.classId}" th:text="${sysClass.className}"></option>
					</select>
				</div>
			</div>

edit 修改下拉框的样式

这个重点是在其中加入：th:field="*{classCid}"这个的作用就是修改默认选中

在这里插入图片描述


  <div class="form-group">
                <label class="col-xs-2 control-label">班级名称：</label>
                <div class="col-xs-2">
                    <select id="sysClass" class="form-control select2-multiple" th:field="*{classCid}">
                        <option th:each="sysClass:${sysClass}" th:value="${sysClass.classId}" th:text="${sysClass.className}"></option>
                    </select>
                </div>
            </div>

我们保存时，将获取下拉框的值赋给data变量
在这里插入图片描述

function submitHandler() {
	        if ($.validate.form()) {
				var data = $("#form-student-add").serializeArray();
				var classCid = $.form.selectSelects("sysClass");
				data.push({"name": "classCid", "value": classCid});
				$.operate.save(prefix + "/add", data);
	        }
	    };
		$(function() {
			$('#sysClass').select2({
				placeholder: "请选择班级",
				allowClear: true,
			});
		})