您的位置:首页 > 编程语言 > ASP

Asp.net MVC]Asp.net MVC5系列——添加数据

2016-12-13 16:31 127 查看

目录

概述

显示添加数据时所用表单

处理HTTP-POST

总结

系列文章

[Asp.net MVC]Asp.net MVC5系列——第一个项目

[Asp.net MVC]Asp.net MVC5系列——添加视图

[Asp.net MVC]Asp.net MVC5系列——添加模型

[Asp.net MVC]Asp.net MVC5系列——从控制器访问模型中的数据

概述

上篇文章介绍了如何通过控制器访问模型中的数据,在本节中我们将要在数据库中追加并保存一些数据。我们将要创建一个表单以及一些表单输入控件,用来输入数据信息。当用户提交表单时将把这些用户输入的信息保存在数据库中。我们可以通过在浏览器中输入“http://localhost:xx/Student/Create”这个URL地址来访问这个表单。

显示添加数据时所用表单

首先,我们需要在我们的StudentController类中追加一个Create方法,该方法返回一个视图,该视图中包含了用户输入信息时所要用到的表单。

1 public ActionResult Create()
2 {
3     return View();
4 }


现在让我们来实现这个Create方法中所要返回的视图,我们将在这个视图中向用户显示追加数据时所需要用到的表单。在Create方法中点击鼠标右键,并点击上下文菜单中的“添加视图”。

在“添加视图”对话框中将模型类指定为“Student”,在支架模板中选择Create,如图所示。

1
2
3 <!DOCTYPE html>
4
5 <html>
6 <head>
7     <meta name="viewport" content="width=device-width" />
8     <title>Create</title>
9 </head>
10 <body>
11 <form action="/Student/Create" method="post"><input name="__RequestVerificationToken" type="hidden" value="-esm1DokcqNfvvHVCnonuFlC9CB0mqi4m7aiPipE6UJ03uuS35Z100j0t-aNx_84Uf4w80Ywe2an4ZWLLjErt2pPIVq-4B4WbMqcIsdHCA81" />        <div class="form-horizontal">
12             <h4>Student</h4>
13             <hr />
14
15
16             <div class="form-group">
17                 <label class="control-label col-md-2" for="stuName">stuName</label>
18                 <div class="col-md-10">
19                     <input class="text-box single-line" id="stuName" name="stuName" type="text" value="" />
20                     <span class="field-validation-valid" data-valmsg-for="stuName" data-valmsg-replace="true"></span>
21                 </div>
22             </div>
23
24             <div class="form-group">
25                 <label class="control-label col-md-2" for="stuSex">stuSex</label>
26                 <div class="col-md-10">
27                     <input class="text-box single-line" id="stuSex" name="stuSex" type="text" value="" />
28                     <span class="field-validation-valid" data-valmsg-for="stuSex" data-valmsg-replace="true"></span>
29                 </div>
30             </div>
31
32             <div class="form-group">
33                 <label class="control-label col-md-2" for="stuBirthdate">stuBirthdate</label>
34                 <div class="col-md-10">
35                     <input class="text-box single-line" data-val="true" data-val-date="字段 stuBirthdate 必须是日期。" data-val-required="stuBirthdate 字段是必需的。" id="stuBirthdate" name="stuBirthdate" type="datetime" value="" />
36                     <span class="field-validation-valid" data-valmsg-for="stuBirthdate" data-valmsg-replace="true"></span>
37                 </div>
38             </div>
39
40             <div class="form-group">
41                 <label class="control-label col-md-2" for="stuStudydate">stuStudydate</label>
42                 <div class="col-md-10">
43                     <input class="text-box single-line" data-val="true" data-val-date="字段 stuStudydate 必须是日期。" data-val-required="stuStudydate 字段是必需的。" id="stuStudydate" name="stuStudydate" type="datetime" value="" />
44                     <span class="field-validation-valid" data-valmsg-for="stuStudydate" data-valmsg-replace="true"></span>
45                 </div>
46             </div>
47
48             <div class="form-group">
49                 <label class="control-label col-md-2" for="stuAddress">stuAddress</label>
50                 <div class="col-md-10">
51                     <input class="text-box single-line" id="stuAddress" name="stuAddress" type="text" value="" />
52                     <span class="field-validation-valid" data-valmsg-for="stuAddress" data-valmsg-replace="true"></span>
53                 </div>
54             </div>
55
56             <div class="form-group">
57                 <label class="control-label col-md-2" for="stuEmail">stuEmail</label>
58                 <div class="col-md-10">
59                     <input class="text-box single-line" id="stuEmail" name="stuEmail" type="text" value="" />
60                     <span class="field-validation-valid" data-valmsg-for="stuEmail" data-valmsg-replace="true"></span>
61                 </div>
62             </div>
63
64             <div class="form-group">
65                 <label class="control-label col-md-2" for="stuPhone">stuPhone</label>
66                 <div class="col-md-10">
67                     <input class="text-box single-line" id="stuPhone" name="stuPhone" type="text" value="" />
68                     <span class="field-validation-valid" data-valmsg-for="stuPhone" data-valmsg-replace="true"></span>
69                 </div>
70             </div>
71
72             <div class="form-group">
73                 <label class="control-label col-md-2" for="stuIsDel">stuIsDel</label>
74                 <div class="col-md-10">
75                     <select class="list-box tri-state" id="stuIsDel" name="stuIsDel"><option selected="selected" value="">未设置</option>
76 <option value="true">True</option>
77 <option value="false">False</option>
78 </select>
79                     <span class="field-validation-valid" data-valmsg-for="stuIsDel" data-valmsg-replace="true"></span>
80                 </div>
81             </div>
82
83             <div class="form-group">
84                 <label class="control-label col-md-2" for="stuInputtime">stuInputtime</label>
85                 <div class="col-md-10">
86                     <input class="text-box single-line" data-val="true" data-val-date="字段 stuInputtime 必须是日期。" id="stuInputtime" name="stuInputtime" type="datetime" value="" />
87                     <span class="field-validation-valid" data-valmsg-for="stuInputtime" data-valmsg-replace="true"></span>
88                 </div>
89             </div>
90
91             <div class="form-group">
92                 <label class="control-label col-md-2" for="Course_classId">stuClass</label>
93                 <div class="col-md-10">
94                     <select id="class" name="class"><option value=""></option>
95 <option value="1">.Net</option>
96 <option value="2">PHP</option>
97 <option value="3">Designer</option>
98 <option value="4">Java</option>
99 <option value="5">C、C++</option>
100 </select>
101                     <span class="field-validation-valid" data-valmsg-for="classId" data-valmsg-replace="true"></span>
102                 </div>
103             </div>
104
105             <div class="form-group">
106                 <div class="col-md-offset-2 col-md-10">
107                     <input type="submit" value="Create" class="btn btn-default" />
108                 </div>
109             </div>
110         </div>
111 </form>
112     <div>
113         <a href="/Student/Index">Back to List</a>
114     </div>
115
116 <!-- Visual Studio Browser Link -->
117 <script type="application/json" id="__browserLink_initializationData">
118     {"appName":"Internet Explorer","requestId":"8e85ac6e799b4435b80844366f60d8a7"}
119 </script>
120 <script type="text/javascript" src="http://localhost:1882/1a3cc807a82642e2a44b68b360bc37ee/browserLink" async="async"></script>
121 <!-- End Browser Link -->
122
123 </body>
124 </html>


View Code
从这段代码中可以看出,表单的action属性被设置为“/Student/Create”,当点击追加按钮时会把表单中各文本框中的数据提交到服务器端进行保存。

处理HTTP-POST

到此为止,我们已经实现了显示追加数据所用表单的所需代码。我们的下一步是编写代码来进行表单提交到服务器后的处理。我们将要获取用户在数据库中输入的信息并且将它们作为一个新的Student保存到数据库中。

为了实现这一处理,我们需要在StudentController类中追加第二个Create方法。这个Create方法具有一个[HttpPost]特性,它意味着我们将要用它来处理提交到“/Student/Create”这个URL地址的Post请求。另外,所有提交到“/Student/Create”这个URL地址的非POST的请求(即GET请求)将被第一个Create方法进行处理,即简单地返回一个空的表单。



总结

本文知识点:

ViewData的使用。

[HttpPost]特性,用来处理post请求。

DropDownList如何绑定数据源。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: