~~开发工具与关键技术: 前端
作者:梁锦豪
撰写时间:2019/5 / 15~~
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
我们在做项目的时候其实很多地方都会用到下拉框,有可能只有一个也有肯能有多个,当只有一个下拉框的的时候还是比较好处理的只需要把下拉框的值一个个填上去就行了,假如是多个值也可以通过一个简单的for循环获取到每一个数据;但如果是多个下拉框的话就比较麻烦,因为一个连着一个,所以我们没办法用一个简单的for循化就可以完成。
首先我们要先在控制器中查询出我们要绑定的数:
![在这里插入图片描述](https://img-blog.csdnimg.cn/20190517084046872.png)
根据表与表直接的连接的关系查询出下一个下拉框所所要绑定的数据(也就是通过ID进行绑定)
![在这里插入图片描述](https://img-blog.csdnimg.cn/20190517084054718.png)
然后再视图那里获取到控制器查询到的数据通过一个叫(appendOption)的方法对下拉进行绑定
![在这里插入图片描述](https://img-blog.csdnimg.cn/20190517084106416.png)
在绑定多个下拉框时要记得,当最开始的那个下拉框的值发生改变时,而且后面的下拉框还存在值时,应该清空后面下拉框的值。
而(appendOption)这个方法,是一个自定义方法(由老师封装的),这个方法是专门为下拉框绑定而封装的,只要传递两个参数就可以进行绑定了(第一个参数是ID,第二参数是方法连接也就是URL)
![在这里插入图片描述](https://img-blog.csdnimg.cn/20190517084116497.png)
而方法的原理也很简单,首先通过一个append的方法设置好value值(定位),然后通过一个each循环获取到每一个下拉框的值。
而第二个下拉框的方法呢就是往届的师兄教我的
![在这里插入图片描述](https://img-blog.csdnimg.cn/20190517084126716.png)
在vo里封装了一个方法 SelectVo Common 在这个文件封装 Tools
上图是单表查询 只要表的ID和表的Name
![在这里插入图片描述](https://img-blog.csdnimg.cn/20190517084136164.png)
直接调用这个方法(createsSelect)(“要绑定下拉框的ID”,“在控制器写的方法url”)
下拉框绑定的两种方法
最新推荐文章于 2022-05-08 20:21:11 发布