mvc VIEW部分介绍

因为如果在view页面中的路径直接写死为<from action="/Home/Save" method="post">那么当Global.asax.cs文件中的Routing自定义或随时修改后,还要连带修改数十个视图中的窗口发送路径.

在MVC中,我们可以使用Html.BeginForm()

Aspx代码

  1. <%
  2. using (Html.BeginForm("Save","Home",FormMethod.Post)){
  3. %>
  4. 窗口内容
  5. <%}%>

Aspx代码

  1. <%
  2. using (Html.BeginForm("Save","Home")){
  3. %>
  4. 窗口内容
  5. <%}%>

如果窗口送出的对象是同一个Action,那么可以简写为

Aspx代码

  1. <%
  2. using (Html.BeginForm()){
  3. %>
  4. 窗口内容
  5. <%}%>

因为送出窗口的对象与当前视图所在的Controller相同,只是Action不同,所以可以通过View的RouteData.Values对象获取当前的所有路由值,并动态加载路由值中的Controller的名称

RouteData.Values

Aspx代码

  1. <%
  2. using (Html.BeginForm(("Save",RouteData.Values["controller"].ToString())){
  3. %>
  4. 窗口内容
  5. <%}%>

使用 <%: Html.TextBox("姓名")%>为mvc2新建的强类型HTML辅助方法

使用强类型的好处在于可以有提示,不必担心把字段名称写错

Model要重、Controller要轻、View要够笨

HTML辅助方法:

MVC内置且常用的HTML辅助方法主要分为两大类:

用于生成超链接的HTML辅助方法,Html. ActionLink()、Html. RouteLink();

用于生成窗口元素的HTML辅助方法,包括Html.BeginForm()、Html. EndFrom()、Html. TextBox()、Html. TextArea()、Html. Password()、Html. Hidden()、Html. CheckBox()、Html. DropDownList()、Html. ListBox()、Html. RadioButton();

Html. ActionLink():

Aspx代码

  1. <%=Html. ActionLink("超链接文字","actionName")%>
  2. <%=Html. ActionLink("超链接文字","actionName","controllerName")%>
  3. <%=Html. ActionLink("超链接文字","actionName","controllerName",new{id=123,page=5})%>

在使用Html. ActionLink()时,超链接文本处不可以输入空白或“null”值,否则会抛“The Value cannot be null or emtty”的异常。

Html. RouteLink():

Aspx代码

  1. <%=Html. RouteLink("会员专区","Member",new{type="default"},new{@class="back"})%>
  2. 等价:
  3. <a class="back" href="Member/?type=default">会员专区</a>

Html. BeginForm():

该方法主要用来产生<form>标签,你可以通过using语法来使用它,也可以配合Html.EndForm()辅助方法产生适当的</from>窗口结尾标签。注意这里使用是<%%>里千万不能加等号。

Html. TextBox():

<%=Html. TextBox("name")%>等价于<input id="name" name="name" type="text" value=""/>由此可知,我们指定了name字段的名称,通过HTML辅助方法产出HTML代码的同时,会同时将id字段赋予和Name字段一样的值。

<%=Html. TextBox("name","value")%>等价于<input id="name" name="name" type="text" value="value"/>注意这里的value不能写“”

<%=Html. TextBox("name","value",new{id="testId"})%> 等价于<input id="testId" name="name" type="text" value="value"/>值得注意的是HTML属性的Class是保留字,当需要设定Class是,需要加上“@”来跳脱

<%=Html. TextBox("name","value",new{id="testId",@class="testClass"})%>

还可以使用IDictionary<stirng object>接口,此重载在同一个页面中有许多HTML标签需要用到相同的的Class或Style等属性时使用。使用此重载需要现在Controller中建立一个Dictionary对象,并且使用ViewData转到View

C#代码

  1. public ActionResult HelperSample(){
  2. IDictionary<string,object> attr = new Dictionary<string,object>();
  3. attr.Add("siez","32");
  4. attr.Add("style","color:red");
  5. ViewData["Dictionary"]=attr;
  6. return View();
  7. }

<%=Html. TextBox("name","value",ViewData["Dictionary"] as IDictionary<string,object>)%>

<%=Html.HttpMethodOverride("HttpVerbs.Delete")%>用来是的MVC支持REST协议。

强类型辅助方法的命名方式皆为在原先名称的最后加上"For"

URL辅助方法:

URL辅助方法与HTML辅助方法很类似,URL辅助方法用于生成HTML代码,HTML辅助方法用于生成网址;

Url.Action():

Aspx代码

  1. <%=Url.Action("About")%>
  2. <%=Url.Action("About",new{id=1})%>
  3. <%=Url.Action("About","Home")%>
  4. <%=Url.Action("About","Home",new{id=1})%>

Url.Encode():

与Server.RrlEncode()方法的用法相同。

Url.Content():

可用于获取绝对路径<%=Url.Content("~/image/Logo.png")%>

Url.RouteUrl():

可以指定使用某个Route name来生成网址

Url.Route(new{id=123}) /Home/Index/123

Url.Route("root") /root/Home/Index

Url.Route("root",new{id=123}) /root/Home/Index/123

Url.Route("root",new{id=123},"https") https://localhost/root/Home/Index/123

Ajax辅助方法:

使用Ajax辅助方法时,必须在页面或MasterPage中加载MicrosoftAjax.js与MicrosoftMvaAjax.js这两个js文件,而要加载顺序要正确,否则会报错。

最常用的辅助方法有:

Ajax.ActionLink()

Ajax.BeginForm()

而这两个辅助方法和Html.ActionLink()、Html.BeginForm大致相同,只是多了一个AjaxOptions类可以设定


AjaxOptions属性名称


 


Confim


单击时会弹出Comfirm对话框


HttpMethod


设定HTTP请求的方法(Get或Post)


InsertionMode


设定通过Ajax辅助方法取回数据时要如果将数据新建到UpdateTargetId属性指定的元素中,有3个方法:

InsertionMode.Replace:替代UpdateTargetId属性指定的内容

InsertionMode.InsertBefore:在UpdateTargetId属性之前插入

InsertionMode.InsertAfter:在UpdateTargetId属性之后插入


LoadingElementId


在读取尚未完成时所显示的区块


OnBegin


设置开始时要执行的JavaScript函数名称


OnComplete


设置结束时要执行的JavaScript函数名称


OnFailure


设置失败时要执行的JavaScript函数名称


OnSuccess


设置完成时要执行的JavaScript函数名称


UpdateTargetId


设定返回值要显示在哪个ID上


Url


设定Request的网址

以下是通过Ajax辅助方法来删除数据Demo:

Aspx代码

  1. <%Ajax.ActionLink("Delete","Delete",new {controller="Home",id="Model.Id"},new AjaxOptions{OnSuccess="Delete",Confirm="你确定要删除么?"},HttpMethod="POST",LoadingElementId="AjaxLoad")%>
  2. <script language="javascript" type="text/javascript">
  3. function Delete(data){
  4. alert(data.get_data);
  5. }
  6. </script>

在Action中

C#代码

  1. [HttpPost]
  2. public ActionResult Delete(string id){
  3. ....
  4. return content("删除成功");
  5. }

自定义HTML辅助方法:

C#代码

  1. using System;
  2. using System.Text;
  3. using System.Web.Mvc;
  4. namespace MvcApplication1.Helpers
  5. {
  6. public static class ImgHelper
  7. {
  8. public static string Img(this HtmlHelper helper,string url,string alternateText,string title){
  9. return String.Format("<img src=‘{0}‘ alt=‘{1}‘ title=‘{2}‘/>",url,alternateText,title);
  10. }
  11. }
  12. }

注意,因为我们使用了自定义的HTML辅助方法,因此,必须在View的最上方将命名空间引用进来,才能使用这个自定义的HTML辅助方法,示例如下:

<%@ Import Namespace="MvcApplication1.Helper"%>

<%=Html.Img....

如果写复杂的Helper类,需要拼接字符串,使用StringBuilder,但是这个类使用没有任何的弹性,所以,MVC设计了TagBuilder类,能够以对象化程度更高的方式生成HTML标签。

验证:

可以使用MVC内置了数据验证机制,只要搭配了ViewModel及ASP.NET 5 sp1,或者ASP.NET4.0提供的Data Annotations函数库,即可实现数据验证,同时实现客户端和服务端的验证

只要在ViewModel中多加载System.ComponentModel.DataAnnotations类,并

[Required(ErrorMessage = "当前密码不能为空!")]

[DataType(DataType.Password)]

[DisplayName("当前密码")]

public stringOldPassword { get; set; }

后台:

利用 ModelState.IsValid验证,我们可以判断通过数据库模型绑定进来的数据是否符合ViewModel字段验证的要求,如果验证失败,则会返回false

前台:

1、在Site.Master文件中添加三个项目内置的JavaScript文件

<scriptsrc="http://www.cnblogs.com/Scripts/MicrosoftAjax.js"type="text/javascript"></script>

<scriptsrc="http://www.cnblogs.com/Scripts/MicrosoftMvcAjax.js"type="text/javascript"></script>

<scriptsrc="http://www.cnblogs.com/Scripts/MicrosoftMvcValidation.js" type="text/javascript"></script>

2、在 <% using (Html.BeginForm()) {%>语句之前加入以下声明:

<%Html.EnableClientValidation(); %>

需要注意的是,a:如果一个页面中有两个或两个以上的窗口需要进行验证,则Html.EnableClientValidation()必须出现在Html.BeginForm()声明之前,否则验证无法执行;b:使用此种验证方式必须使用Html.BeginForm()声明窗口。

3、在每个字段上加上 <%: Html.ValidationMessageFor(model => model.Name, "", new{ Style = "color:red" })%>

以显示验证失败的错误提示

重复发送信息:

为了解决这样现象,可以使用PRG(Post-Redirect-Get)样式的概念,当遇到需要传送窗口数据的情况时,会先通过Http Post请求送出数据,在处理完数据之后,立即转向(Redirect)另一个网址,最后通过Http Get请求取得跳转后的页面

public ActionResult About(ViewModel model){

。。。

return RedirectToAction("Other", "Home");

如果我们希望在About接受到的ViewModel数据传递给Other视图,这时就必须使用TempData机制来传递这种只会用到"1次"的数据。

TempData是一个Dictionary对象,它与ViewData很想,但非常特殊,所有存储在TempData中的数据只能被参考一次,用过之后数据就会被清空,我们可以利用TempData的特性,将About动作接受到的ViewMode类的数据传递给Other。

在About方法中需要有

TempData["LastPostViewModel"]=model;

然后在Other中

if(TempData["LastPostViewModel"]==null){

return RedirectToAction("Index");

}

var model = (强转)TempData["LastPostViewModel"];

时间: 2024-08-24 04:33:40

mvc VIEW部分介绍的相关文章

Essential ASP.NET MVC日历排程控件Essential Schedule for ASP.NET MVC 控件介绍及下载

Essential Schedule for ASP.NET MVC是一款界面控件,让开发人员添加OutLook外观的日历日程控件到你应用程序中,支持AJAX,内嵌多种皮肤,支持多种时间视图,支持打印等. 具体功能: 支持日程水平或垂直显示. 支持在运行时创建.读取.更新和删除任务活动 支持拖拉任务活动 支持设置任务活动的优先级 支持设置循环任务活动 支持为任务活动设置提示信息 控件为任务活动提供了右键菜单,以便客户更方便操作 支持Day View.Week View.Workweek View

.NET Core实战项目之CMS 第十三章 开发篇-在MVC项目结构介绍及应用第三方UI

作为后端开发的我来说,前端表示真心玩不转,你如果让我微调一个位置的样式的话还行,但是让我写一个很漂亮的后台的话,真心做不到,所以我一般会选择套用一些开源UI模板来进行系统UI的设计.那如何套用呢?今天就以我们系列实战教程中的CMS系统为例来应用第三方的后台模板LayuiCMS2.0为例来进行实战演练吧! 本文已收录至<.NET Core实战项目之CMS 第一章 入门篇-开篇及总体规划> 作者:依乐祝 首发地址 "DotNetCore实战"公众号 原文地址:https://w

Android群英传笔记系列一view的介绍

学习完第一行代码后,继续学习Android群英传,希望能坚持下去,好好学习完这本书,并及时做好相关笔记,巩固相关知识: 一. View的介绍: 1`.我们先来看下view树结构: 2.树结构内容: a.viewparent是整棵树的核心,它统一调度和分配所有的交互管理事件. b.控件分为viewgroup和view两种控件,viewgroup作为父控件可以包含多个vie       w控件. c.我们知道在使用控件前都要通过findViewById的方法来实例化控件,那么在树结构中,实际上表现为

ASP.NET MVC View使用Conditional compilation symbols

由于View(.cshtml)的运行时编译关系,在项目级别中定义的symbols是无法被直接使用的.需要在Web.config中添加compilerOptions(在View目录下的Web.config添加无效),该设置同样适用于ASP.NET其它技术.假如你需要一个TEST的定义,参考如下: Web.config <system.codedom> <compilers> <compiler language="c#;cs;csharp" extensio

【记录】ASP.NET MVC View 移动版浏览的奇怪问题

ASP.NET MVC View 中的一段代码: <span id="span_Id">@Model.ID</span> 没什么问题吧,浏览器浏览正常,查看元素为: <span id="span_Id">123456</span> 但如果是用手机浏览器,查看元素是这样的: <span id="span_Id"><a href="tel:123456">12

ZendFramework-2.4 源代码 - 关于MVC - View层 - 控制器返回值

<?php class ReturnController extends AbstractActionController { public function returnAction() { // 返回方式一 :会被dipatch处理器Zend\Mvc\View\Http\CreateViewModelListener::createViewModelFromArray(...)的拦截处理 return array('key1' => 'key1value'); // == new View

Html.DropDownList 选中 mvc view 弱类型

List<Model.SysGroup> listGroup = sysGroupBll.Where(o => o.IsSb == true, o => o.Id).ToList();            List<SelectListItem> items = new List<SelectListItem>();            foreach (var group in listGroup)            {              

View的介绍和运用 &amp;&amp; FlexBox布局

开始我们今天的项目学习啦~~~~~~ 1> 第一步当然是创建项目啦: 进入终端: 创建ViewDemo项目 命令如下啦,你看懂了对吧...嘻嘻!!! 2>View的介绍和运用 项目安装创建成功后,用webStorm打开项目,开始编写代码看效果啦~~~ /** * Sample React Native App * https://github.com/facebook/react-native * @flow */ import React, { Component } from 'react

ASP.NET MVC View 和 Web API 的基本权限验证

ASP.NET MVC 5.0已经发布一段时间了,适应了一段时间,准备把原来的MVC项目重构了一遍,先把基本权限验证这块记录一下. 环境:Windows 7 Professional SP1 + Microsoft Visual Studio 2013(MVC 5 + Web API 2) 修改Web.config,增加Forms验证模式,在system.web节点中增加以下配置: <authentication mode="Forms"> <forms loginU