.NET MVC第四章、模型绑定获取表单数据

2022-11-30 19:19:35 浏览数 (1)

.NET MVC第四章、模型绑定获取表单数据


目录

.NET MVC第四章、模型绑定获取表单数据

模型绑定概述

获取值demo

模型获取值

文件获取,必须使用post接收

可空int参数

文件上传


模型绑定概述

模型绑定就是将浏览器发送的HTTP请求数据转换为.NET对象的过程。 模型绑定使得在控制器中可以直接获取视图、或URL传递来的数据,且这些数据可以自动转换为模型对象,以便调用。 模型绑定机制省略了常见Request.QueryString手动传值和类型转换的步骤,这样可以专注地处理模型对象。

获取值demo

获取方法1、参数获取 获取方法2、Request.QueryString["userName"]

控制器 

代码语言:javascript复制
public ActionResult Index(string pwd)
{
    ViewBag.userName = Request.QueryString["userName"];
    ViewBag.pwd = pwd;
    return View();
}

视图层 

代码语言:javascript复制
<h2>表单传值</h2>
<hr />
<form action="~/Test/Index" method="get">
    <p>账号<input type="text" name="userName" placeholder="请输入账号" /></p>
    <p>密码<input type="password" name="pwd" placeholder="请输入密码" /></p>
    <p><input type="submit" value="提交" class="btn btn-block btn-primary" /></p>
</form>
<hr />

@ViewBag.userName
<br />
@ViewBag.pwd

效果:

模型获取值

在Models下创建User.cs作为模型

创建Users对象

控制器

代码语言:javascript复制
public ActionResult Index(Users users)
{
    ViewBag.userName = users.userName;
    ViewBag.pwd = users.pwd;
    return View();
}

视图层不变。

效果:

共计尝试了三种获取值的方法,还有一种获取文件的方法。

文件获取,必须使用post接收

控制器

代码语言:javascript复制
[HttpPost]
public ActionResult GetImg(HttpPostedFileBase file)
{
    string fileName = file.FileName;
    ViewBag.fileName = "上传文件的名称:" fileName;
    // 保存到测试目录
    file.SaveAs("D:\" fileName);
    return Redirect("~/Test/Index");
}

视图层

表单提交图片,必须是post提交,并且添加enctype="multipart/form-data"上传图片

代码语言:javascript复制
<h2>获取图片</h2>
<hr />
<form action="~/Test/GetImg" method="post" enctype="multipart/form-data">
    <p><input type="file" name="file"/></p>
    <p><input type="submit" value="提交" class="btn btn-block btn-primary" /></p>
</form>

上传图片

D盘查看文件:

可空int参数

在“ Index(string gname, int? gid)”方法的参数声明中,gid参数需要设定为int?类型,这种类型称为“可空 int类型”。 当文本框输入的内容包含“非int类型”或“空数据”时,模型绑定器将无法正确实现int类型转换,默认的绑定随之失效。为避免出现这类异常,需要为控制器的相关参数设定“可空类型”或“参数默认值”。

控制器

代码语言:javascript复制
public ActionResult Index(string userName,int? age=2)
{
    ViewBag.userName = userName;
    ViewBag.age = age;
    return View();
}

视图层

代码语言:javascript复制
<h2>int?</h2>
<hr />
<form action="~/Test/Index" method="get">
    <p><input type="text" name="userName" placeholder="请输入用户名" /></p>
    <p><input type="text" name="age" placeholder="请输入用年龄" /></p>
    <p><input type="submit" value="提交" class="btn btn-block btn-primary" /></p>
</form>
<hr />
@ViewBag.userName
<br />
@ViewBag.age

未传参效果:

传参效果

文件上传

控制器

代码语言:javascript复制
[HttpPost]
public ActionResult GetImg(HttpPostedFileBase file)
{
    //文件名
    string fileName = file.FileName;
    //文件后缀需要引入using System.IO;
    string Ext = Path.GetExtension(fileName);
    //获取服务路径
    string serverPath = Server.MapPath("/");
    //生成随机不重复图片名称UUID
    string uuid = System.Guid.NewGuid().ToString("N");
    //拼接保存位置
    string saveUrl=serverPath   uuid   Ext;
    // 保存到测试目录
    file.SaveAs(saveUrl);
    TempData["saveUrl"] = uuid Ext;
    return Redirect("~/Test/Index");
}

视图层

代码语言:javascript复制
<h2>获取图片</h2>
<hr />
<form action="~/Test/GetImg" method="post" enctype="multipart/form-data">
    <p><input type="file" name="file"/></p>
    <p><input type="submit" value="提交" class="btn btn-block btn-primary" /></p>
</form>
<hr/>
显示图片路径:
@TempData["saveUrl"]
<hr/>
<img src="~/@TempData["saveUrl"]" width="500"/>

效果:

保存位置

图片这里必须要会,很重要。

0 人点赞