绑定多个下拉框数据(关系式)

……………………………………………………………………………………………………………

开发工具与关键技术:Visual Studio 2015 C#

作者:林敏静

撰写时间:2019年4月24日

……………………………………………………………………………………………………………

现实生活中有很多事物之间都有一定的关系,比如上下管制级关系,就是我们比较常见的啦,我们绝大部分人存在于或者说存在过上下级关系里面,就举个简单例子,在学校里面,校领导->老师->学生,这种由上级到下级的管制关系。那么回到本文的正题,多个下拉框的数据之间可以存在有怎么样的关系呢?下面来看一个例子:
如下图,这里已经写了三个下拉框,分别是学院、年级和班级,因为我们还没开始绑定数据嘛,所以里面都还没有内容的。
绑定多个下拉框数据(关系式)
看到这三个下拉框,我们可以轻易判断出它们之间的关系,一个学院里可以含有多个年级,一个年级里面可以含有多个班级,一个学校(这里指大学)肯定也含有多个学院,意思就是众多学院里的有众多年级,众多年级里有众多班级,也许是相同学院而不同年级,也许同年级(指年级ID)不同学院或不同班级,同班级(指班级ID)而不同学院或不同年级,当我们想准确找到某个学院里的某年级某班级的时候该如何做呢?若一个个地去找避免有点繁琐,那么我们就可以绑定这三个下拉框的数据,把它们的数据关系串联起来,就可以快速准确地查找到数据了。
按层级关系来说,学院是最高层,那么我们先来到控制器写查询学院数据的方法,这里我们查询的数据比较多,就把查询到的数据放在一个列表里面,所以最后是返回一个列表。
绑定多个下拉框数据(关系式)
刚刚说过,年级是被包含在学院里面的,所以我们要根据学院ID来查找年级信息,这里的查询与上面学院的查询有些不同,就是多了个学院的参数(AcademeID)

绑定多个下拉框数据(关系式)

同理,班级是被包含在年级里面,所以是根据年级ID来查找班级信息的,代码写法与上图查询年级的一样,就不重复放图了。
接着就是来页面请求数据了,先来绑定学院下拉框的数据,过程就是使用异步到控制器请求数据,这里的异步用的是get方法,也可以用post方法,控制器那边接收到数据请求后就执行查询方法把数据查找出来,数据查找出来就把数据返回到视图给下拉框赋值,这样学院下拉框的数据就绑定成功了。
绑定多个下拉框数据(关系式)

接着就是年级的下拉框数据绑定了,既然我们是根据学院ID查询年级信息的,那么我们在学院的下拉框点击选择学院数据时,年级的下拉框就应该呈现学院下拉框那边选择的学院里拥有的年级数据信息,也就是说学院下拉框选择值变动时,年级下拉框的数据信息须是学院下拉框选择值所拥有的,除非学院的选择值没有下级,就是没有年级信息。

绑定多个下拉框数据(关系式)

这里的数据请求与上面学院的页面数据请求有什么不同呢?在年级数据查询方法那里我们添加了一个学院参数,所以这里异步请求数据的时候要把那个参数写进去,再有这里请求之前多了个清空元素,这是为什么呢?因为我们在初次选择学院下拉框数据的时候,年级的下拉框数据是属于这个学院选择值的,但我们若再次选择学院时,年级下拉框的数据仍是上一次的学院数据的,也就是没有发生改变,那么我们就用到那个清空元素了,在学院下拉框选择值改变的时候,把年级下拉框的数据清空后再重新请求相应的数据,这样两个下拉框的关系就对得上了。
班级下拉框与年级下拉框同理,也就不多啰嗦了。最后我们来看看三个下拉框完成的效果。

绑定多个下拉框数据(关系式)

通过这三个下拉框之间的关系进行绑定下拉框数据,我们就可以从中快速准确地找到所需的数据了

注:本文例子来自课堂案例

相关文章: