Layui-下拉框

Layui-下拉框
文献种类：专题技术文献；
开发工具与关键技术： VS、JS
作者：方建恒；年级：20级；撰写时间： 2022 年 2 月 8日
今天我们来讲一下Layui插件里的动态下拉框数据绑定。
在layui的表单中我们的下拉框要变成动态的话就需要Layui的方法，
一般的方法会在Layui表单渲染的时候被刷新掉，
所以我们得用Layui的方法来进行绑定数据，这样才可以绑定上去。
接下来我们来实际运用一下：
首先我们把Layui的JS和CSS引入，
然后创建一个Layui样式的下拉框， id为xlk ，代码如图：
然后我们创建一个类，将其命名为。
这个类将用于下拉框数据的获取，代码如下：
然后我们开始动态获取数据，我们先加载&初始化layui组件，
然后调用方法() ，并传递过去路径和下拉框ID 。如图：
然后对下拉框进行重载，重载时间为0.5秒，代码如图：
接下来我们来写()方法，
我们用url和id分别来接收传递过来的路径和下拉框ID ，
然后用向控制器发送请求，

文章插图
再用empty()方法删除匹配的元素集合中所有的子节点，
然后声明一个标签，然后遍历控制器传递过来的数据，
把它拼接到刚才声明的标签里，最后再添加到页面上的下拉框。
具体代码如图：
接下来是控制器部分，
【Layui-下拉框】控制器部分十分简单，你只需要写一个数据查询就好了，
因为下拉框的数据一般是一张表的数据，
所以我们只需要进行单表查询就可以了，
下面是我的查询，大家可以参考一下：
是我上面写好的一个类，用于下拉框数据的获取和回填，