MVC下拉框的傳值的兩種方式

http://www.cnsendblog.com/index.php/?p=137
GPS平臺、網站建設、軟件開發、系統運維，找森大網絡科技！
http://cnsendnet.taobao.com

以前使用WebForm變成時，下拉框傳值只需直接在后臺綁定代碼就可以了。現在我們來看看在MVC中DropDownList是如果和接受從Controller傳過來的值的。

第一種：使用DropDownList

控制器代碼：

1.  public ActionResult Index()  
2.  {  
3.    
4.      //1.1查詢YzSeriesEntity的數據  
5.      List<Model.YzSeriesEntity> seriesList = seriesBLL.LoadEnities().ToList();  
6.      //1.2將YzSeriesEntity的數據封裝到 SelectList中，制定要生成下拉框選項的value和text屬性  
7.      SelectList selList1 = new SelectList(seriesList, "SerialName", "SerialName");  
8.    
9.      //2.1查詢YzDivisionEntity的數據  
10.     List<Model.YzDivisionEntity> divisionList = divisionBLL.LoadEnities().ToList();  
11.     //2.2講YzDivisionEntity的數據封裝到 SelectList中，制定要生成下拉框選項的value和text屬性  
12.     SelectList selList2 = new SelectList(divisionList, "DivisionName", "DivisionName");  
13.   
14.     //3.調用Selectlist的As方法，自動生成SelectListItem集合，并存入ViewBag中  
15.     ViewBag.selList1 = selList1.AsEnumerable();  
16.     ViewBag.selList2 = selList2.AsEnumerable();  
17.      
18.     return View();  
19. }  

視圖代碼：

1.  <!-------------- 添加對話框-------------->  
2.  <div id="addDiv">  
3.      @using (Ajax.BeginForm("Add", new AjaxOptions() { OnSuccess = "afterAdd" }))  
4.      {  
5.          <table>  
6.              <tr>  
7.                  <td>編號：</td>  
8.                  <td>  
9.                      @Html.TextBox("StaffID")  
10.                 </td>  
11.             </tr>  
12.             <tr>  
13.                 <td>姓名：</td>  
14.                 <td>@Html.TextBox("StaffName")</td>  
15.             </tr>  
16.             <tr>  
17.                 <td>性別：</td>  
18.                 <td>  
19.                     <input type="radio" id="GenderM" name="Sex" value="男" />男  
20.                     <input type="radio" id="GenderF" name="Sex" value="女" checked />女  
21.                 </td>  
22.             </tr>  
23.             <tr>  
24.                 <td>所在系列：</td>  
25.                 <td>  
26.                     @Html.DropDownList("SerialName", ViewBag.selList1 as IEnumerable<SelectListItem>)  
27.                 </td>  
28.             </tr>  
29.             <tr>  
30.                 <td>科室或年級組：</td>  
31.                 <td>  
32.                     @Html.DropDownList("DivisionName", ViewBag.selList2 as IEnumerable<SelectListItem>)  
33.                 </td>  
34.             </tr>  
35.             <tr>  
36.                 <td>任課學科：</td>  
37.                 <td>  
38.                     @Html.TextBox("Subjects")  
39.                 </td>  
40.             </tr>  
41.             <tr>  
42.                 <td>聘任日期：</td>  
43.                 <td>  
44.                     @Html.TextBox("EngageDate")  
45.                 </td>  
46.             </tr>  
47.             <tr>  
48.                 <td>參加工作日期：</td>  
49.                 <td>  
50.                     @Html.TextBox("WorkDate")  
51.                 </td>  
52.             </tr>  
53.             <tr>  
54.                 <td>職稱：</td>  
55.                 <td>  
56.                     @Html.TextBox("jobQualification")  
57.                 </td>  
58.             </tr>  
59.             <tr>  
60.                 <td>身份證號：</td>  
61.                 <td>  
62.                     @Html.TextBox("IdentityCard")  
63.                 </td>  
64.             </tr>  
65.   
66.         </table>  
67.     }  
68.   
69. </div>  

效果顯示：

第二種：使用<select></select>

視圖代碼：

1.  <!--選擇權重-->  
2.  <div>  
3.      <span>@Html.Label("請選擇權重：")</span>  
4.      <span>  
5.          <select id="cc" class="easyui-combobox" name="dept"  
6.                 data-options="valueField:'ID',textField:'Weight',url:'/SettingEvaluation/ListOption'" />  
7.      </span>  
8.  </div>  

控制器代碼：

1. //下拉框對應的列表
2. public ActionResult ListOption()
3. {
4. //2.1.查詢出weight實體,并將其轉成DTO類型
5. List<Model.DTO.YzWeightEntityDTO> weightList =
6. weightBLL.LoadEnities().ToList().Select(s => s.ToDto()).ToList();
7. //2.2返回json
8. return Json(weightList, JsonRequestBehavior.AllowGet);
10. }
    效果顯示：
    
    總結：
    兩種傳值方式的比較：
    第一種是控制器通過ViewBag傳值，前臺通過@Html.DropDownList接收；第二種是通過Json傳值，前臺通過url綁定valueField和textField的值來獲取數據。兩者沒有什么太大的不同，但是由于傳值使用<select></select>接收的，使用的是HTML標簽，所以還可以用來綁定其他的js事件，所以如果有功能需要的話，后者要比前者靈活些。

http://www.cnsendblog.com/index.php/?p=137
GPS平臺、網站建設、軟件開發、系統運維，找森大網絡科技！
http://cnsendnet.taobao.com