springboot + layui + mybatis 的select下拉框联动

借鉴的某位大佬的，时间久了，忘了哪位了，抱歉

1.实体类，就不写了，各自有各自的enttity
2.mapper层

public Integer  SysSteelTankImgMapper {
	List<SysSteelTankImg> queryAll(); //<SysSteelTankImg>我自己的实体类
}

3.mybatis层

 <select id="queryAll" resultMap="BaseResultMap">
    select * from sys_steel_tank_img where id;
  </select>

4.service层

 public interface SteelTankService {
 	List<SysSteelTankImg> queryAll();
}
 

@Service
public class SteelTankServiceImpl implements SteelTankService {
    @Autowired
    private SysSteelTankImgMapper sysSteelTankImgMapper;
	
	 @Override
    public List<SysSteelTankImg> queryAll() {
        return sysSteelTankImgMapper.queryAll();
    }
}

6.controller层

@RequestMapping("/index")
@RestController
public class SelectController {
    @Autowired
    private SteelTankService steelTankService;

 @GetMapping("/mon")
    public List<SysSteelTankImg> youSelfInfo() {
        return steelTankService.queryAll();
    }
}

7.layui页面

 <form class="layui-form">
	<div class="layui-form-item">
        <div class="layui-input-inline layui-form">
            <select name="sid" id="selectcid">
                <option value="" >请选择槽号</option>
            </select>
        </div>
	</div>
</form>

8.js层

<script type="application/javascript">
    layui.use('form',function () {
        var form = layui.form;
        //加载机构类型
        $.ajax({
            url: '/index/mon', //你自己的接口
            dataType: 'json',
            success: function (data) {
                $('#selectcid').empty();
                $.each(data.data, function (index, item) {
                    $('#selectcid').append(new Option(item.sid, item.id));// 下拉菜单里添加元素，sid是你需要查询的数据库中的字段
                });
                layui.form.render("select");
            },error: function () {
                alert("查询失败")
            }
        });
    });
</script>

效果图如下