【ASP.NET MVC】View與Controller之間傳遞數據

1 概述 1 概述本篇文章主要從操作上簡要分析Controller<=>View之間相互傳值，關於頁面之間傳值，如果感興趣，可參考我另外一篇文章ASP.NET 頁面之間傳值的幾種方式。 Controller=》View：Model,ViewBag,ViewData,TempData,ViewBa ...

1 概述

本篇文章主要從操作上簡要分析Controller<=>View之間相互傳值，關於頁面之間傳值，如果感興趣，可參考我另外一篇文章ASP.NET 頁面之間傳值的幾種方式。

Controller=》View：Model,ViewBag,ViewData,TempData,ViewBag=>ViewData,ViewData=>ViewBag,ViewModel,JqGrid,AJAX+第三方插件等；

View=》Controller：QueryString,Form,FormCollection,Ajax,自定義模型綁定等；

2 Controller向View傳遞數據

2.1 Model傳遞數據

(1)DB表：

(2)Model

 1 public class CustomerInfo
 2     {
 3         public string EmployeeID { get; set; }
 4         public string EmployeeName { get; set; }
 5         public string EmployeeMajor { get; set; }
 6         public string EmployeeDepartment { get; set; }
 7         public string EmployeeTel { get; set; }
 8         public string EmployeeEmail { get; set; }
 9         public string EmployeeJiGuan { get; set; }
10         public string EmployeeAddress { get; set; }
11         public string EmployeePosition { get; set; }
12         public string EmployeeBirthday { get; set; }
13     }

(3)Controller

a.控制器action

public ActionResult ModelDataToView()
        {
            //定義集合
            List<CustomerInfo> ltPI = new List<CustomerInfo>();
            DataTable dt = GetCustomerInfoToDataTable();
            for (int i = 0; i < dt.Rows.Count; i++)
            {
                CustomerInfo custInfo = new CustomerInfo();
                custInfo.EmployeeID = dt.Rows[i]["EmployeeID"].ToString();
                custInfo.EmployeeName = dt.Rows[i]["EmployeeName"].ToString();
                custInfo.EmployeeMajor = dt.Rows[i]["EmployeeMajor"].ToString();
                custInfo.EmployeeDepartment = dt.Rows[i]["EmployeeDepartment"].ToString();
                custInfo.EmployeeTel = dt.Rows[i]["EmployeeTel"].ToString();
                custInfo.EmployeeEmail = dt.Rows[i]["EmployeeEmail"].ToString();
                custInfo.EmployeeJiGuan = dt.Rows[i]["EmployeeJiGuan"].ToString();
                custInfo.EmployeeAddress = dt.Rows[i]["EmployeeAddress"].ToString();
                custInfo.EmployeePosition = dt.Rows[i]["EmployeePosition"].ToString();
                custInfo.EmployeeBirthday = dt.Rows[i]["EmployeeBirthday"].ToString();
                ltPI.Add(custInfo);
            }
          return View("Index",ltPI);
        }

b.ADO.NET 獲取CustomerInfo數據

 1 //獲取用戶實體
 2         public DataTable GetCustomerInfoToDataTable()
 3         {
 4             //連接字元串
 5             string conStr = ConfigurationManager.ConnectionStrings["conStr"].ConnectionString;
 6             string strSql = @"SELECT * FROM EmployeeInfo";
 7             using (SqlConnection conn = new SqlConnection(conStr))
 8             {
 9                 conn.Open();
10                 SqlCommand cmd = new SqlCommand(strSql, conn);
11                 cmd.ExecuteNonQuery();
12                 SqlDataAdapter sda = new SqlDataAdapter(strSql, conn);
13                 DataSet ds = new DataSet();
14                 sda.Fill(ds,"CustomerInfo");
15                 return ds.Tables["CustomerInfo"];
16             }
17         }

(4)View

 1 @{
 2     Layout = null;
 3 }
 4 
 5 <!DOCTYPE html>
 6 
 7 <html>
 8 <head>
 9     <meta name="viewport" content="width=device-width" />
10     <link href="~/OuterLibrary/jquery-ui-themes-1.12.1/jquery-ui.css" rel="stylesheet" />
11     <link href="~/OuterLibrary/bootstrap/bootstrap/css/bootstrap.css" rel="stylesheet" />
12     <link href="~/OuterLibrary/bootstrap/bootstrap/css/bootstrap-responsive.css" rel="stylesheet" />
13     <script src="~/OuterLibrary/Jquery/jquery-3.2.1.js"></script>
14     <script src="~/OuterLibrary/bootstrap/bootstrap/js/bootstrap.js"></script>
15     <title>Index</title>
16 </head>
17 <body>
18     <div class="table-responsive">
19        <table class="table table-striped">
20                 <thead>
21                    <tr>
22                         <td>員工ID</td>
23                         <td>員工姓名</td>
24                         <td>員工專業</td>
25                         <td>員工部門</td>
26                         <td>員工電話</td>
27                         <td>員工郵件</td>
28                         <td>員工籍貫</td>
29                         <td>員工住址</td>
30                         <td>員工職位</td>
31                         <td>員工生日</td>
32                     </tr>
33                 </thead>
34                 <tbody>
35                     @foreach (var item in Model)
36                     {
37                         <tr>
38                             <td>@item.EmployeeID</td>
39                             <td>@item.EmployeeName</td>
40                             <td>@item.EmployeeMajor</td>
41                             <td>@item.EmployeeDepartment</td>
42                             <td>@item.EmployeeTel</td>
43                             <td>@item.EmployeeEmail</td>
44                             <td>@item.EmployeeJiGuan</td>
45                             <td>@item.EmployeeAddress</td>
46                             <td>@item.EmployeePosition</td>
47                             <td>@item.EmployeeBirthday</td>
48                         </tr>
49                     }
50                 </tbody>
52             </table>
53    </div>
54 </body>
55 </html>

(5)結果

2.2 ViewData傳遞數據

(1)DB表：

(2)Model

 1 public class CustomerInfo
 2     {
 3         public string EmployeeID { get; set; }
 4         public string EmployeeName { get; set; }
 5         public string EmployeeMajor { get; set; }
 6         public string EmployeeDepartment { get; set; }
 7         public string EmployeeTel { get; set; }
 8         public string EmployeeEmail { get; set; }
 9         public string EmployeeJiGuan { get; set; }
10         public string EmployeeAddress { get; set; }
11         public string EmployeePosition { get; set; }
12         public string EmployeeBirthday { get; set; }
13     }

(3)Controller

a.控制器action

 1  //ViewData傳遞
 2         public ActionResult ViewDataToView()
 3         {
 4             List<CustomerInfo> ltPI = new List<CustomerInfo>();
 5             DataTable dt = GetCustomerInfoToDataTable();
 6             for (int i = 0; i < dt.Rows.Count; i++)
 7             {
 8                 CustomerInfo custInfo = new CustomerInfo();
 9                 custInfo.EmployeeID = dt.Rows[i]["EmployeeID"].ToString();
10                 custInfo.EmployeeName = dt.Rows[i]["EmployeeName"].ToString();
11                 custInfo.EmployeeMajor = dt.Rows[i]["EmployeeMajor"].ToString();
12                 custInfo.EmployeeDepartment = dt.Rows[i]["EmployeeDepartment"].ToString();
13                 custInfo.EmployeeTel = dt.Rows[i]["EmployeeTel"].ToString();
14                 custInfo.EmployeeEmail = dt.Rows[i]["EmployeeEmail"].ToString();
15                 custInfo.EmployeeJiGuan = dt.Rows[i]["EmployeeJiGuan"].ToString();
16                 custInfo.EmployeeAddress = dt.Rows[i]["EmployeeAddress"].ToString();
17                 custInfo.EmployeePosition = dt.Rows[i]["EmployeePosition"].ToString();
18                 custInfo.EmployeeBirthday = dt.Rows[i]["EmployeeBirthday"].ToString();
19                 ltPI.Add(custInfo);
20                 ViewData["CustomerInfo"] = ltPI;
21             }
22             return View();
23         }

b.ADO.NET 獲取CustomerInfo數據

 1 //獲取用戶實體
 2         public DataTable GetCustomerInfoToDataTable()
 3         {
 4             //連接字元串
 5             string conStr = ConfigurationManager.ConnectionStrings["conStr"].ConnectionString;
 6             string strSql = @"SELECT * FROM EmployeeInfo";
 7             using (SqlConnection conn = new SqlConnection(conStr))
 8             {
 9                 conn.Open();
10                 SqlCommand cmd = new SqlCommand(strSql, conn);
11                 cmd.ExecuteNonQuery();
12                 SqlDataAdapter sda = new SqlDataAdapter(strSql, conn);
13                 DataSet ds = new DataSet();
14                 sda.Fill(ds,"CustomerInfo");
15                 return ds.Tables["CustomerInfo"];
16             }
17         }

(4)View

 1 @using MVCCrud.Areas.JqGridDemo.Models
 2 
 3 
 4 @{
 5     Layout = null;
 6 }
 7 
 8 <!DOCTYPE html>
 9 
10 <html>
11 <head>
12     <meta name="viewport" content="width=device-width" />
13     <link href="~/OuterLibrary/jquery-ui-themes-1.12.1/jquery-ui.css" rel="stylesheet" />
14     <link href="~/OuterLibrary/bootstrap/bootstrap/css/bootstrap.css" rel="stylesheet" />
15     <link href="~/OuterLibrary/bootstrap/bootstrap/css/bootstrap-responsive.css" rel="stylesheet" />
16     <script src="~/OuterLibrary/Jquery/jquery-3.2.1.js"></script>
17     <script src="~/OuterLibrary/bootstrap/bootstrap/js/bootstrap.js"></script>
18     <title>ViewDataToView</title>
19 </head>
20 <body>
21     <div class="table-responsive">
22         <table class="table table-striped">
23             <thead>
24                 <tr>
25                     <td>員工ID</td>
26                     <td>員工姓名</td>
27                     <td>員工專業</td>
28                     <td>員工部門</td>
29                     <td>員工電話</td>
30                     <td>員工郵件</td>
31                     <td>員工籍貫</td>
32                     <td>員工住址</td>
33                     <td>員工職位</td>
34                     <td>員工生日</td>
35                 </tr>
36             </thead>
37             <tbody>
38                 @foreach (var item in (List<CustomerInfo>)ViewData["CustomerInfo"])
39                 {
40                     <tr>
41                         <td>@item.EmployeeID</td>
42                         <td>@item.EmployeeName</td>
43                         <td>@item.EmployeeMajor</td>
44                         <td>@item.EmployeeDepartment</td>
45                         <td>@item.EmployeeTel</td>
46                         <td>@item.EmployeeEmail</td>
47                         <td>@item.EmployeeJiGuan</td>
48                         <td>@item.EmployeeAddress</td>
49                         <td>@item.EmployeePosition</td>
50                         <td>@item.EmployeeBirthday</td>
51                     </tr>
52                 }
53 
54             </tbody>
55         </table>
56     </div>
57 </body>
58 </html>

(5)結果

2.3 ViewBag傳遞數據

(1)DB表：

(2)Model

 1 public class CustomerInfo
 2     {
 3         public string EmployeeID { get; set; }
 4         public string EmployeeName { get; set; }
 5         public string EmployeeMajor { get; set; }
 6         public string EmployeeDepartment { get; set; }
 7         public string EmployeeTel { get; set; }
 8         public string EmployeeEmail { get; set; }
 9         public string EmployeeJiGuan { get; set; }
10         public string EmployeeAddress { get; set; }
11         public string EmployeePosition { get; set; }
12         public string EmployeeBirthday { get; set; }
13     }

(3)Controller

a.控制器action

 1 //ViewBag傳遞
 2         public ActionResult ViewBagDataToView()
 3         {
 4             List<CustomerInfo> ltPI = new List<CustomerInfo>();
 5             DataTable dt = GetCustomerInfoToDataTable();
 6             for (int i = 0; i < dt.Rows.Count; i++)
 7             {
 8                 CustomerInfo custInfo = new CustomerInfo();
 9                 custInfo.EmployeeID = dt.Rows[i]["EmployeeID"].ToString();
10                 custInfo.EmployeeName = dt.Rows[i]["EmployeeName"].ToString();
11                 custInfo.EmployeeMajor = dt.Rows[i]["EmployeeMajor"].ToString();
12                 custInfo.EmployeeDepartment = dt.Rows[i]["EmployeeDepartment"].ToString();
13                 custInfo.EmployeeTel = dt.Rows[i]["EmployeeTel"].ToString();
14                 custInfo.EmployeeEmail = dt.Rows[i]["EmployeeEmail"].ToString();
15                 custInfo.EmployeeJiGuan = dt.Rows[i]["EmployeeJiGuan"].ToString();
16                 custInfo.EmployeeAddress = dt.Rows[i]["EmployeeAddress"].ToString();
17                 custInfo.EmployeePosition = dt.Rows[i]["EmployeePosition"].ToString();
18                 custInfo.EmployeeBirthday = dt.Rows[i]["EmployeeBirthday"].ToString();
19                 ltPI.Add(custInfo);
20                 ViewBag.CustomerInfo = ltPI;
21             }
22             return View();
23         }

b.ADO.NET 獲取CustomerInfo數據

 1 //獲取用戶實體
 2         public DataTable GetCustomerInfoToDataTable()
 3         {
 4             //連接字元串
 5             string conStr = ConfigurationManager.ConnectionStrings["conStr"].ConnectionString;
 6             string strSql = @"SELECT * FROM EmployeeInfo";
 7             using (SqlConnection conn = new SqlConnection(conStr))
 8             {
 9                 conn.Open();
10                 SqlCommand cmd = new SqlCommand(strSql, conn);
11                 cmd.ExecuteNonQuery();
12                 SqlDataAdapter sda = new SqlDataAdapter(strSql, conn);
13                 DataSet ds = new DataSet();
14                 sda.Fill(ds,"CustomerInfo");
15                 return ds.Tables["CustomerInfo"];
16             }
17         }

(4)View

 1 @{
 2     Layout = null;
 3 }
 4 
 5 <!DOCTYPE html>
 6 
 7 <html>
 8 <head>
 9     <meta name="viewport" content="width=device-width" />
10     <link href="~/OuterLibrary/jquery-ui-themes-1.12.1/jquery-ui.css" rel="stylesheet" />
11     <link href="~/OuterLibrary/bootstrap/bootstrap/css/bootstrap.css" rel="stylesheet" />
12     <link href="~/OuterLibrary/bootstrap/bootstrap/css/bootstrap-responsive.css" rel="stylesheet" />
13     <script src="~/OuterLibrary/Jquery/jquery-3.2.1.js"></script>
14     <script src="~/OuterLibrary/bootstrap/bootstrap/js/bootstrap.js"></script>
15     <title>ViewBagDataToView</title>
16 </head>
17 <body>
18     <div class="table-responsive">
19         <table class="table table-striped">
20             <thead>
21                 <tr>
22                     <td>員工ID</td>
23                     <td