练习:

新建一个mvc项目

要求:

有3个视图  Login Index Details

目的:
感受一下MVC与传统WebForm的差异性

WebForm的请求模型

MVC请求模型

传统WebForm与MVC区别

WebForm 实际上请求的是一个页面对象

MVC 不仅请求了一个页面对象,还向服务器请求了具体的业务处理方法

程序结构如下

一,项目模板和视图引擎介绍

项目模板

基本: 一般选择这个  它会自动将一些Jquery库导入进来

Internet应用程序:外网使用的

Intranect应用程序:内网使用

Web API:一个轻量级的WebService

知识点:

Web API:使用JSON格式传输数据

WebService:使用XML格式传输数据

视图引擎:

ASPX:在前台用<% %>形式写C#

Razor:在前台用@语法写C#

二,添加一个控制器Controller

控制器模板:

空MVC控制器:只有一个默认的Index方法

包含空的读/写操作的MVC控制器:会将增删改查的Action方法自动添加到当前控制器代码中

三,返回一个String字符串

public string PrintStr()
{
return "hello mvc4";
}

运行后:

四,添加视图Login.cshtml

前台:Login.cshtml

@model MvcApplication1.Models.User
@{
Layout = null;
}
<!DOCTYPE html> <html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Login</title>
</head>
<body>
<div>
<h3>登录</h3>
ViewBag接收后台数据:@ViewBag.tips <br /><br />
Model接收后台数据: @Model.UName <br /><br /> <form action="/User/Login" method="post">
<input type="text" name="UName" /><br /><br />
<input type="password" name="UPwd" /><br /><br />
<input type="submit" value="登入" />
</form> </div>
</body>
</html>

后台:

        [HttpGet]
public ViewResult Login()
{
//向前台传值
ViewBag.tips = "hello, welcome to here"; Models.User model = new Models.User();
model.UName = "华子"; return View(model);
}

@{Layout = null;}

表示当前视图不使用默认的母版页

 

后台向前台传值,有两种方式

ViewBag

Return View(model)

 

强类型视图

在csdhmtl顶部指定model类型,形式如@model MvcApplication1.Models.User,就叫强类型型视图

好处:在VS中可以智能提示,可以直接写如@Model.UName

五,提交Login.cshtml后重定向

前台:

<form action="/User/Login" method="post">
<input type="submit" value="登入" />
</form>

 

后台:

       [HttpPost]
public ActionResult Login(Models.User model)
{
if (model.UName == "lvhua" && model.UPWD == "")
{
return Redirect("/User/Index");
}
Response.Write("<script>alert('用户名或密码错误');location.href='/User/Login'</script>");
return null; }

重定向

使用Return Redirect (路径) ,相当于Response.Redirect

[HttpPost]和[HttpGet]

如果控制器中有两个同名的Action方法时,应该用.net特性[HttpPost]和[HttpGet]区别

ActionResult和ViewResult

ViewResult       一般用于加载当前视图

ActionResult    一般用于重定向

后台接收前台表单数据

前台表单控件name命名与model属性名相同,后台Action方法参数中就可以用model来接收了,服务器会把表单中的数据加进model里

六,显示Index.cshtml

前台:

@{
Layout = null;
} <!DOCTYPE html> <html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
</head>
<body>
<h3>Index</h3>
<div>
@for (int i = 1; i <= 10; i++)
{
<text>@i</text><span>只老虎</span>
<a href="/User/Details/@i">进入</a><br />
} </div>
</body>
</html>

如果只想显示纯文本,可用<text>标签

七,显示Details.cshtml

前台:

@{
Layout = null;
} <!DOCTYPE html> <html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Details</title>
</head>
<body>
<h3>Details</h3>
<div>
<span>第</span>@ViewBag.id<span>只老虎</span>
</div>
</body>
</html>

后台:

       public ViewResult Details(int id)
{
ViewBag.id = id;
return View();
}

后台如何获取跳转的id?

前一个页面,遵守RouteConfig的url格式

<a href="/User/Details/@i">进入</a><br />

后台Action方法中参数id即可获取(参数id名称须与RouteConfig配置的id同名)

Asp.net MVC4之 一个简单的小例子的更多相关文章

  1. 一个简单的小例子让你明白c#中的委托-终于懂了!

    模拟主持人发布一个问题,由多个嘉宾来回答这个问题. 分析:从需求中抽出Host (主持人) 类和Guests (嘉宾) 类. 作为问题的发布者,Host不知道问题如何解答.因此它只能发布这个事件,将事 ...

  2. WebSocket在ASP.NET MVC4中的简单实现

    WebSocket在ASP.NET MVC4中的简单实现 2013-12-21 20:48 by 小白哥哥, 810 阅读, 3 评论, 收藏, 编辑 WebSocket 规范的目标是在浏览器中实现和 ...

  3. 记一次ASP.NET MVC4 升级到MVC5的小问题解决

    原文:记一次ASP.NET MVC4 升级到MVC5的小问题解决 .NET 4.0 MVC4版本,升级到.NET 4.6.1 MVC5: 1.使用nuget更新所有 与mvc相关的类库; 2.更改~/ ...

  4. asp.net mvc4 过滤器的简单应用:登录验证

    直接上代码,不要说话. ASP.NET MVC4过滤器的简单应用:验证登录 [AcceptVerbs(HttpVerbs.Post)] public ActionResult login(FormCo ...

  5. 输出多行字符的一个简单JAVA小程序

    public class JAVA { public static void main(String[] args) { System.out.println("-------------- ...

  6. python -----一个简单的小程序(监控电脑内存,cpu,硬盘)

    一个简单的小程序 用函数实现!~~ 实现: cpu 使用率大于百分之50 时  ,  C 盘容量不足5 G 时, 内存 低于2G 时. 出现以上其中一种情况,发送自动报警邮件! 主要运用 到了两个 模 ...

  7. 3.2 Lucene实战:一个简单的小程序

    在讲解Lucene索引和检索的原理之前,我们先来实战Lucene:一个简单的小程序! 一.索引小程序 首先,new一个java project,名字叫做LuceneIndex. 然后,在project ...

  8. 给 asp.net core 写一个简单的健康检查

    给 asp.net core 写一个简单的健康检查 Intro 健康检查可以帮助我们知道应用的当前状态是不是处于良好状态,现在无论是 docker 还是 k8s 还是现在大多数的服务注册发现大多都提供 ...

  9. 一个有趣的小例子,带你入门协程模块-asyncio

    一个有趣的小例子,带你入门协程模块-asyncio 上篇文章写了关于yield from的用法,简单的了解异步模式,[https://www.cnblogs.com/c-x-a/p/10106031. ...

随机推荐

  1. haproxy配置监控redis主备切换(转)

    环境前提:     redis sentinel配置,三台主机,且配置运行良好        配置文件中添加: frontend ft_redis  bind 0.0.0.0:6379 name re ...

  2. 近期在调用 calendar.js 的时候出现中文乱码! 解决方式

    近期写一个小项目的时候:在调用 calendar.js  的时候出现中文乱码! 如图所看到的: 原因在于: 我的jsp 页面,指定的是 UTF-8 编码,然而,调用的 calendar.js 的编码确 ...

  3. Android自己定义控件——3D画廊和图像矩阵

    转载请注明出处:http://blog.csdn.net/allen315410/article/details/39932689 1.3D画廊的实现 我们知道android系统已经为我们提供好了一个 ...

  4. cURL安装和使用笔记

    0.前言     cURL是一个利用URL语法在命令行下工作的文件传输工具.它支持文件上传和下载,所以是综合传输工具,但习惯称cURL为下载工具.cURL还包含了用于程序开发的libcurl.cURL ...

  5. 用Qt开发Web和本地混合的应用

    QtWebkit 模块使得Qt widget能够通过HTML的object标签嵌入到web页面中,并通过JavaScript代码进行访问,而Qt对象也能相应的访问web页面元素. 将Qt对象插入到we ...

  6. [置顶] 页面缓存,cache,设置缓存过期时间,OutputCache

    页面缓存 方法一: protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { //缓存有数据 if (Cach ...

  7. Flex与Java交互(Flex调用java类展示数据)解析xml展示数据

    Flex与java通信最简单例子(详细说明了各种需要注意的配置):http://blog.csdn.net/u010011052/article/details/9116869 Flex与java通信 ...

  8. GitLab 5.3 升级注意事项

    最主要就是需要更新的Git.我的Ubuntu12.04通过apt-get install安装的git版本过低. 所以只能通过源代码安装. 参考下面的步骤: wget git-core.googleco ...

  9. deque,list,queue,priority_queue

    1.deque deque双端队列容器与vector一样,采用线性表顺序存储结构,但与vector唯一不同的是,deque采用分块的线性存储结构来存 储数据,每块的大小一般为512字节,称为一个deq ...

  10. VSTO之旅系列(三):自定义Excel UI

    原文:VSTO之旅系列(三):自定义Excel UI 本专题概要 引言 自定义任务窗体(Task Pane) 自定义选项卡,即Ribbon 自定义上下文菜单 小结 引言 在上一个专题中为大家介绍如何创 ...