【c#/MVC】运用MVC模式，做一个增删查改简单数据库，以及涉及到的知识
RT。
本文分三部分：程序结构、遇到问题、部分源代码在最后。
更新ing……
————————————————————————————————————————————
目录
程序结构：
遇到问题：
1、MVC三个部分之间的数值传递和调用（特别是控制器和视图之间）
2、MVC调用数据库的连接字符串设置
3、视图的局部刷新（ajax的使用）
几个在实验中的发现：
了解到的ajax资料：
4、相关的几个JS函数调用：
5、从视图将form表单的内容传递回控制器的简易方法
6、ADO.NET相关
7、Json
8、[HttpPost]
源代码：
————————————————————————————————————————————
程序结构：
辅助类：1个（SqlCommandHelper），其中有两个方法：（源代码在最后）
public List GETStudentMessage(string sqlStr,int id）
//用于使用dataReader方式从数据库中读取表单数据
public bool WriteStudentMessage(string sqlStr, SqlParameter[] para)
//用于向数据库中写入数据 视图、控制器、和模型部分：如图
遇到问题：
1、MVC三个部分之间的数值传递和调用（特别是控制器和视图之间）
当建立好模型后，就要根据模型来做好视图和控制器，因为本次练习涉及的页面很少，只建立了一个模型：student，以及一个控制器：StudentDB,而与两者相对有很多视图。继续拿出这张图：
其中：（注，这里仅仅列举用到的方法，更多的没有接触的没有列举）
控制器-》模型-》视图：这一条没啥说的，直接调用就好了（补充：这里似乎有所要求，遗漏了什么，日后补充），然后根据下面到视图
控制器-》视图：如果没有数据的话，仅仅是直接调用视图，ActionResult方法直接返回视图的名字（不带名字就返回默认同名的视图）；如果带有数据，可以return一个Json（注意方法的返回类型也要变成JsonResult；Json很好用，里面是类的话，可以直接取出属性。），也可以return Content(变量);
视图-》用户-》控制器：带数据利用form表单比较好用（局部时则利用AJAX），也可以通过herf直接不带数据直接调用控制器.
2、MVC调用数据库的连接字符串设置
在主目录（非视图下的目录）的WEB.CONFIG文件里的
这是新版.net Framework的方法，老版的方式是在
老版实例：
同样的，name自己取，Data Source是连接字符串
注意最后有个providerName的属性为"System.Data.SqlClient"
不论新版老版，设置好后，在控制器中，用一句
string conStr = ConfigurationManager.AppSettings["studentsConstr"];
SqlConnection conn = new SqlConnection(conStr);即可取得你设置好的连接字符串，以后要修改时也只要在WEB.CONFIG里修改一次即可，是不是很好用～～～
3、视图的局部刷新（ajax的使用）
这是个难点，因为做之前完全没学过ajax。
先把遇到的问题阐述：在更新学生信息的视图中，用户需要先输入一个对应的ID，如果存在，在下方显示几个文本框input，input里放着取出的信息，然后将要修改的信息修改后，点击提交，就可以将新的信息通过控制器提交到数据库。
这其中，如何让新出现的input中刷新取得的信息（局部页面刷新）？就要用到ajax了。
先通过js的函数设置点击事件，然后在事件中写上ajax方法。我的代码如下。
function toSubmit() {
//当点击按钮后，就调用这里的方法
//这里面可以做表单提交前的验证判断
$("#submitIdRequest").submit;
var studentId = $("#studentid").val();//定义个变量，在下边的ajax内获取这个变量
hidden2();
//文本框对象
var textId = $("#Id2");
var textName = $("#Name");
var textNumber = $("#Number");
var textSex = $("#Sex");
var textAge = $("#Age");
var textCourse1 = $("#Course1");
var textCourse2 = $("#Course2");
//alert(studentId);
//这里写ajax方法
//ajax主要是在不重新加载整个页面情况下，与服务器交换数据，并刷新部分页面
$.ajax({
url: "/StudentDB/UpdateAjax_test",
data: { studentID: studentId },//将从后台（control里获取的数据赋值给这里定义的变量）
async: true,//异步
type: "post",
dataType: "json",
success: function (data)//当方法成功时，执行……
{
//alert(data.id,data.name);
if (data) {
alert("update sucessfully!");
textId.val(data.id);
textName.val(data.name);
textNumber.val(data.number);
textSex.val(data.sex);
textAge.val(data.age);
textCourse1.val(data.course1);
textCourse2.val(data.course2);
//alert(@ViewData["id"]);
//textid.val('@ViewData["id"]');
//location.href = '/StudentDB/UpdateAjax_test2';
//complete:studentDetailsBack();
}
else {
alert("update fail!");
}
}
});
}几个在实验中的发现：
- ajax的回调函数（success和error）中，不可以使用ViewData和viewbag的，这两个只能在静态的页面部分使用，使用语法是【@ViewData["属性名"]】和【var id='@ViewBag.id';】（怀疑是异步的原因）
- ajax的回调函数可以执行控制器的方法，也可以直接跳转其他页面【//location.href = '/StudentDB/UpdateAjax_test2';
- 】【 //complete:studentDetailsBack();】
- 虽然一般从后台取数据用get，传数据用post，但其实post和get方式都可以从后台取得数据，get还没试过，post的话，不需要在data中设置要取的数据名（这里设置的是传入后台的数据名），而是直接在后台方法中返回一个json就可以用了（返回类型是JsonResult）
- 查资料时，似乎可以同时存在两个ajax，不过其中一个要在另一个的回调函数中（通过function方式），且要设置async为同步（即false），最后嫌麻烦没有试，以后有机会试试。
了解到的ajax资料：
代码模板：
$.ajax({
type: "POST",
url: "/login",
contentType: 'application/x-www-form-urlencoded;charset=utf-8',
data: {username:$("#username").val(), password:$("#password").val()},
dataType: "json",
success: function(data){
console.log(data);
}，
error:function(e){
console.log(e);
}
});参数解释：
| 名称 | options | async | beforeSend(XHR) | cache | complete(XHR, TS) | contentType | context | data | dataFilter | dataType |
|---|---|---|---|---|---|---|---|---|---|---|
| 类型 | Object | Boolean | Function | Boolean | Function | String | Object | String | Function | String |
| 默认值 | true（异步），可改为false（同步） | 默认值: true，dataType 为 script 和 jsonp 时默认为 false。
|
参数： XMLHttpRequest 对象和一个描述请求类型的字符串。 | 默认值: "application/x-www-form-urlencoded"。发送信息至服务器时内容编码类型。 | 这个对象用于设置 Ajax 相关回调函数的上下文。也就是说，让回调函数内 this 指向这个对象 | 发送到服务器的数据。将自动转换为请求字符串格式 | 提供 data 和 type 两个参数：data 是 Ajax 返回的原始数据，type 是调用 jQuery.ajax 时提供的 dataType 参数。函数返回的值将由 jQuery 进一步处理。 | "xml" "html" "script" "json" "jsonp ""text" |
||
| 作用 | AJAX 请求设置。所有选项都是可选的。 | 发送请求前可修改 XMLHttpRequest 对象的函数，如添加自定义 HTTP 头。 XMLHttpRequest 对象是唯一的参数。 |
设置为 false 将不缓存此页面。 | 请求完成后回调函数 (请求成功或失败之后均调用)。 | 默认值适合大多数情况。如果你明确地传递了一个 content-type 给 $.ajax() 那么它必定会发送给服务器（即使没有数据要发送）。 | （如果不设定这个参数，那么 this 就指向调用本次 AJAX 请求时传递的 options 参数）。 | GET 请求中将附加在 URL 后。 | 给 Ajax 返回的原始数据的进行预处理的函数。 | 预期服务器返回的数据类型。 | |
| 注 | 可选 | 同步请求将锁住浏览器，用户其它操作必须等待请求完成才可以执行。 | 这是一个 Ajax 事件。如果返回 false 可以取消本次 ajax 请求。 | jQuery 1.2 新功能。 | 这是一个 Ajax 事件。 | 比如指定一个 DOM 元素作为 context 参数，这样就设置了 success 回调函数的上下文为这个 DOM 元素。 | 如果为数组，jQuery 将自动为不同值对应同一个名称。如 {foo:["bar1", "bar2"]} 转换为 '&foo=bar1&foo=bar2'。 | 如果不指定，jQuery 将自动根据 HTTP 包 MIME 信息来智能判断，比如 XML MIME 类型就被识别为 XML。 |
4、相关的几个JS函数调用：
//打开时某个ID自动隐藏，并在某个方法中设置显示
function hidden1() { document.getElementById("dispaly1").style.display = "none";}
function hidden2() { document.getElementById("dispaly1").style.display = "block"; }
window.onload = hidden1;//我也不知道有没有用……
//当文本框内容改变时，触发对应的事件，并把自己的ID作为参数
5、从视图将form表单的内容传递回控制器的简易方法
在视图的form中设置各个input的name后
在相应的控制器方法中，设置参数为【FormCollection f】，这个参数可以提供窗体传回来的所有值。
例如：一个【f.xxxx】就可以获得。
//view
//Controller中
public ActionResult DelDetaile(FormCollection f)
{
string sqlStr = "DelStudentDetails";
SqlParameter[] para = { new SqlParameter("@id", SqlDbType.Int) };
para[0].Value = f["Id"];
SqlCommandHelper sqlCommandHelper = new SqlCommandHelper();
bool judgeWriteStudentMessage = sqlCommandHelper.WriteStudentMessage(sqlStr, para);
if (judgeWriteStudentMessage == false)
{ return View("FalseOperation"); }
else
{ return View("SuccessfulOperation"); }
}
6、ADO.NET相关
感觉没啥写的……
把上面第5中的sqlCommandHelper.WriteStudentMessage(sqlStr, para);方法体贴出来吧……
public bool WriteStudentMessage(string sqlStr, SqlParameter[] para)
{
SqlConnection conn = new SqlConnection(conStr);
SqlCommand cmd = new SqlCommand(sqlStr, conn);
cmd.CommandType = System.Data.CommandType.StoredProcedure;
conn.Open();
cmd.Parameters.AddRange(para);
SqlDataReader dataReader = cmd.ExecuteReader();
cmd.Parameters.Clear();
dataReader.Close();
conn.Close();
return true;
}
7、Json
JSON 是轻量级的文本数据交换格式，JSON 文本格式在语法上与创建 JavaScript 对象的代码相同，JSON 比 XML 更小、更快，更易解析。
目前仅仅在从控制器传递到视图中的ajax方法时用到……
将控制器的方法设置为【JsonResult】，然后返回值返回一个JSON，在对应的视图中直接【 var textId = $("#Id2");】（data为取得json的返回值，实际上就是json本身）
8、[HttpPost]
System.Web.Mvc.dll中对它的注解是：表示一个特性，该特性用于限制操作方法，以便该方法仅处理 HTTP POST 请求。
具体来讲，就是对于Mvc Controller中的方法，如果你希望该方法只能通过前台表单的Post方式来访问并且传输数据的话，通过添加[HttpPost]注解即可实现，这样，该方法就不会通过Get方法进行请求，限制了该操作方法的请求类型。
同理，还有一个【HttpGet】。
此外，找到了一个不错的详细解说：链接地址
——————————————————————————————————————————————
源代码：
本来想直接贴出来……不过最后还是决定上传一下，因为太多了……
注意主目录（非views文件夹下）web.config的数据库地址要改成自己的
【源代码地址】：https://download.csdn.net/download/qq_40245756/10875657