下拉框绑定数据

今天我给大家带来的下拉框数据的绑定。打开VS工具，找到我们的项目，点击右键添加新建文件夹，然后创建Models的文件，把数据库的数据引进来。我就新建一个控制器，创建试图，第一个试图是页面布局的样式(如下图)

页面布局完成后，回到控制器。我要绑定的下拉框是学院改变的时候，年级才能发生改变，等年级改变之后，班级才能进行选择。在绑定数据之前，我教大家三种查询数据的方法。首先声明一个类叫SelectVo的类型，这个类里面我给了一个id和text，id主要查询你要绑定数据的ID，而text是你要查询数据的名称。下面是我用三种不同的方法对学院进行查询(第一种方法:List<>)
List listAcademe = (from tbAcademe in myModel.SYS_Academe
select new SelectVo
{ id = tbAcademe.AcademeID,
text = tbAcademe.AcademeName
}).ToList();
return Json(listAcademe, JsonRequestBehavior.AllowGet);
List是一个列表，由于我们查询的数据不止一条，所以我们要创建一个列表，然后把我们查询出来的数据放在列表里面。在上面，我用List ，然后创建一个listAcademe的名称，就可以用linq的方法对要查询的表进行引用(from是指数据的来源，tbAcademe是一个范围变量)，由于前面我们用到了SelectVo的方法，所以我们要new 出这个方法，然后给要查询学院的ID和名称，这里的id和text一定要和SelectVo声明的id和text要一致，不然就会报错。
第二种方法(linq)，我用匿名类型关键字var进行声明，(匿名类型提供了一种方便的方法，可用来将一组只读属性封装到单个对象中，而无需首先显式定义一个类型。 类型名由编译器生成，并且不能在源代码级使用。每个属性的类型由编译器推断，可通过使用 new 运算符和对象初始值创建匿名类型)，这样我们就不用调用Select的方法，但我们还是要查询数据的ID和名称，这里的id和text名称可以不用跟Select声明的类型名称一样，但可能查询的时候数据会出错。
第三种方法(Lambda),用Lambda的方法对数据的查询更方便，代码量更少。Lambda的关键方法(C#中的Lambda表达式使用Lambda运算符“=>”，该运算符读为“goes to”。语法：参数 => 表达式（方法体）)
var listAcademe2 = myModel.SYS_Academe
.Select(a => new { id = a.AcademeID, text = a.AcademeName });
查询的三种方法讲完后，我们就进入今天的内容，学院下拉框的数据查询出来之后，我们就可以查询年级的信息了。由于年级是根据学院的改变而改变，所以我们要在声明试图这里引用学院ID,（如下图）

我用的是linq的方法。年级的数据查询出来后，我们就查询班级的信息，由于班级的信息是根据年级的变化而变化，所以我们要引入年级的ID，跟上图的步骤是一样的。把这三张表的数据查询出来后，就可以进行下拉框的绑定了。
查询的代码写完之后，我们来到第一个试图。把要用到的JS样式引入进来，然后我们自己创建一个在里面写我们要绑定数据的方法。首先我们把学院的下拉框给绑定，下面是绑定学院的的代码:
$(document).ready(function () {
$.get(“SelectAcament”, function (data) {
$.each(data, function (i) {
KaTeX parse error: Expected 'EOF', got '#' at position 3: ("#̲sltAcademe").ap…(document).ready(function(){})的方法等同于$(function(){})的方法，用到了get的提交方法，我们可以用each的方法对数据绑定数据的变化，也可以用for的方法。
绑定完学院的数据，我们就绑定年级的数据，因为年级是根据学院的改变而改变的，所以获取学院的ID,当学院改变的时候去触发年级
$("#sltAcademe").change(function () {
var AcademeID = $("#sltAcademe").val();
appendOption(“sltGrade”, “SelectByGrade?AcademeID=” + AcademeID);
});
由于年级和班级的代码量的形式是一样的，我就封装了一个函数appendOption，主要是减少代码量。appendOption(id,url),里面的id是我们要传递的元素ID，列如我们要传入的是年级ID(sltGrade),而url是你要传递的数据链接。在这里，我用的是getJSON的提交方法，然后empty是清空元素，当empty清空元素的时候，下拉框里面的请选择也会一起被删除，所以，我们添加一个请选择的样式。由于班级的样式跟年级的样式差不多，我就不多讲了，只要把年级的ID,代替上面的学院ID，然后把班级的ID，代替上面的年级ID,修改链接和传递的参数，这样就可以实现年级的改变，而触发班级的改变。

当所有的数据都写完整之后，我们就可以实现页面的效果了，启动页面，实现的效果图(如下图)

学习总结：通过学习下拉框的绑定，我对ASP.NET MVC有了一定的了解，下拉框的绑定也是考验我们对查询方法的一种掌握。通过这次写文献，我感到自己的实力还是需要提高，我希望我也可以向他人一样写一些更高级的文献和技术。希望大家和我一起努力去学习ASP.NET MVC的知识点吧，学习MVC对我们以后的开发有一定的影响。