Razor的布局(Layout)

默认建的工程都自带的了一个_ViewStart.cshtml文件,文件里面的代码如下:

  1. @{ Layout = "~/Views/Shared/_Layout.cshtml";}

这里的  @{Layout="文件路径";}  代码块指定了整个项目默认所使用的布局文件(如图:)

左边蓝色部分显示了MVC4提供的默认的布局文件,我们看看_Layout.cshtml里面的内容:

不难看出,_Layout.cshtml里面就是html静态页面。对于里面的一些语法做简单的说明:

@RenderBody()对于所有的页面默认的情况下都会使用这个布局(WebForm的模板)

@RenderBody()相当于一个占位符其他页面的所有内容都会被引擎渲染在这个地方。

@RenderSecion()这个占位符表示:在这里会渲染页面里面的一个节(可以是html代码也可以是c#代码和Html的结合体)。

Note:假如你不想使用默认的布局,或者是你的web应用有多个页面布局文件怎么办呢?

其实很简单,例如:你新建了一个view页面UserInfo.cshtml,你可以在UserInfo.cshtml文件里面写上

@{Layout = null;}

就可以了,这个时候就不会应用布局文件了,假如你想定义一个新的布局(依照惯例优先的原则),我们在Views/Shared下面创建一个自己的布局_MyLayout.cshtml文件,然后我们给我们创建的新页面指定如下的布局就行了:

@{ Layout = "~/Views/Shared/_MyLayout.cshtml";}

对于上面的

@RenderSection("scripts", required: false)做一个补充说明,第一个参数指明:在子页面被渲染的节的名称,第二个参数:指定子页面这个节是否是必需的,如果指定了required:true;但是在子页面没有给这个名称的节的话,编译是通不过的。

如果我们想在母版页使用默认的节可以做如下的判断:

  1. @if(IsSectionDefined("sectionName"))
  2. {
  3. @RenderSection("sectionName")
  4. }
  5. else
  6. {
  7. <span>默认节</span>
  8. }

假如子页面有这个节我们就渲染子页面的,没有的话就显示我们默认的Html块(例如:网站的头部,底部,侧边栏等等)。

Razor语法的分类

基本语法

  1. @using :引入命名空间
  2. @model:声明强类型的数据Model类型
  3. @section:定义要实现母版页的节信息
  4. @RenderBody():当创建基于此布局页面的视图时,视图的内容会和布局页面合并,而新创建视图的内容会通过布局页面的@RenderBody()方法呈现在标签之间。
  5. @RenderPage:呈现一个页面。比如网页中固定的头部可以单独放在一个共享的视图文件中,然后在布局页面中通过这个方法调用,用法如下:
  6. @RenderPage("~/Views/Shared/_Header.cshtml")
  7. @RenderSection:布局页面还有节(Section)的概念,便于局部呈现

1.行内(inline)C#(服务器端代码)形式(行内代码

@变量例如:@User.Name,变量或属性结束后,任何形式文本或者标签都自动被解析为html,如遇结束判断有歧义,请加括号如下
@( 表达式 )  例如:@(i + 1) 或 @(User.Name)    括号里面为:表达式,或者变量
@方法调用  例如:@Html.TextBox("UserName").ToString()

2. 代码块

第一种情况:

@{ 代码块 }

@if (条件) { 代码块 }

@switch (条件) { 分支匹配代码块 }

@for (循环控制) { 代码块 }

@foreach (循环控制) { 代码块 }

@while (循环控制) { 代码块 }

@do { 代码块 } while (循环控制) 『 代码块里面的代码要严格按照c#语法来,每行结束必需有分号』

第二种情况:(代码块中的文本或者Html客户端标签)

单行文本

@:行内文本 换行的话自动变成了C#服务器端代码。

多行文本 

任何标签对 例如:<div>多行文字</div>

任何自闭合标签 例如:<img 多行属性 />

纯文字使用伪标签<text> 例如:<text>多行文字,两侧标签不会被输出</text>

3.其他

电子邮箱可以自动识别,例如:123456@qq.com

被误认为是电子邮箱的请加括号(),例如:123456(@UserName)

要输出商标版权等的,请用@字符转义,例如:@@ →会输出单个字符@

HtmlHelper和AjaxHelper

Html.BeginForm的两种写法:

第一种使用Using语句:

  1. @using(Html.BeginForm())
  2. {
  3. }

第二种使用代码块闭合的形式(注意form是代码块形式的不是行内代码:所以结尾必需有分号)

  1. @{Html.BeginForm();}
  2. @{Html.EndForm();}

Ajax.BeginForm()的写法只有一种:因为我并没有看到Ajax.EndForm()。呵呵估计是微软的开发团队开发Razor引擎的时候漏掉了

  1. @using (Ajax.BeginForm(new AjaxOptions { UpdateTargetId="",OnSuccess=""}))
  2. {
  3. }

这里要想Ajax的Form有效的话我们必须在view页面引入支持Ajax的Js脚本。如下:

  1. @Scripts.Render("~/bundles/jqueryval")

这个是微软的脚本捆绑技术,实际上捆绑的就是(以下的JS代码)


不难看到其中就有ajax的Javascript脚本

对于AjaxForm的提交参数的指定:

当异步请求成功时,会去使用后端返回的内容局部更新UpdateTargetId所指定的客户端的html标签内容,然后调用OnSuccess指定的客户端的JS方法。

具体参数说明可以参照MSDN:

OnSuccess:http://msdn.microsoft.com/zh-cn/library/system.web.mvc.ajax.ajaxoptions.onsuccess(v=vs.108).aspx

对于Razor智能感知的一点补充

在微软的cshtml页面,@后面跟一些对象的时候会自动出现智能感知

当我们自定义一个类,让后想让这个类在Razor引擎有只能感知能力的时候。我们可以找到

Views/Web.config文件,打开文件我们会发现如下的节点:

  1. <system.web.webPages.razor>
  2. <host factoryType="System.Web.Mvc.MvcWebRazorHostFactory, System.Web.Mvc, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" />
  3. <pages pageBaseType="System.Web.Mvc.WebViewPage">
  4. <namespaces>
  5. <add namespace="System.Web.Mvc" />
  6. <add namespace="System.Web.Mvc.Ajax" />
  7. <add namespace="System.Web.Mvc.Html" />
  8. <add namespace="System.Web.Optimization"/>
  9. <add namespace="System.Web.Routing" />
  10. </namespaces>
  11. </pages>
  12. </system.web.webPages.razor>

我们只要把我们的类所在的命名空间添加进去就可以了。

Razor的一些实用功能(极大的灵活性)

Partial Page Output Caching(部分页输出缓存)

我们可以使用@Html.Action()来请求一个处理方法,并将放返回的Model或者ViewModel对象渲染到页面。

通过使用OutputCache特性,我们实现了对对象的缓存。因此当发生重复请求时,就可以自动输出缓存信息避免频繁查询数据库,减轻服务器负担和提高响应速度

C#3.0新特性

MVC4相关Razor语法以及Form表单(转载)的更多相关文章

  1. MVC4相关Razor语法以及Form表单

    Razor的布局(Layout) 默认建的工程都自带的了一个_ViewStart.cshtml文件,文件里面的代码如下: @{ Layout = "~/Views/Shared/_Layou ...

  2. MVC4相关Razor语法浅谈

    1._LayOut.cshtml 文件为mvc的布局文件,里面包函的是htm的静态文件,作为mvc其他view的基础母版使用,子视图要不想想调用它只需在页面设置@{Layout=null;}即可,现对 ...

  3. asp.net mvc4 使用java异步提交form表单时出现[object object] has no method ajaxSubmit

    最近接手了一个单子,说大不大,只是功能不少,开发过程中遇到该问题 先看脚本截图: 本以为是笔误,哪儿写错了,可是看来看去,都没发现有不合适的地方,对比过网上很多代码,都差不多,于是各种方式的,各种原因 ...

  4. HTML的<form>表单标签

    表单 HTML 表单用于搜集不同类型的用户输入. ㈠Form标签 ⑴form标签简介 在HTML中,如果创建一个表单,就把各种表单标签放在<form></form>标签内部.我 ...

  5. JsonResponse类的使用、form表单上传文件补充、CBV和FBV、HTML的模板语法之传值与过滤器

    昨日内容回顾 Django请求生命周期 # 1.浏览器发起请求 到达Django的socket服务端(web服务网关接口) 01 wsgiref 02 uwsgi + nginx 03 WSGI协议 ...

  6. Django学习笔记(6)——Form表单

    知识储备:HTML表单form学习 表单,在前端页面中属于最常见的一个东西了.基本上网站信息的提交都用到了表单,所以下面来学习Django中优雅的表单系统:Form 表单的主要作用是在网页上提供一个图 ...

  7. js文件上传原理(form表单 ,FormData + XHR2 + FileReader + canvas)

    目录 form表单上传 FormData + XHR2 + FileReader + canvas 无刷新本地预览压缩上传实例 目前实现上传的方式 浏览器小于等于IE9(低版本浏览器)使用下面的方式实 ...

  8. 巨蟒python全栈开发django11:ajax&&form表单上传文件contentType

    回顾: 什么是异步? 可以开出一个线程,我发出请求,不用等待返回,可以做其他事情. 什么是同步? 同步就是,我发送出了一个请求,需要等待返回给我信息,我才可以操作其他事情. 局部刷新是什么? 通过jq ...

  9. 前端之form表单与css(1)

    目录 一.form表单 1.1表单的属性 1.2input 1.2.1form表单提交数据的两种方式 1.3select标签 1.4label标签 1.5textarea多行文本标签 二.CSS 2. ...

随机推荐

  1. php 5.5 xhprof for windows

    今天看到一个好的性能优软件xhprof(有facebook开发的类库)在国内找了很多网站都没有找到相关php5.5的扩展,只好FQ还是外面的世界精彩一下就找到了link (http://windows ...

  2. ACM常用模板

    数论: 中国剩余定理(互质与非互质通用版) ],r[]; int e_gcd(int a,int b,int &x,int &y) { ) { x=; y=; return a; } ...

  3. C# 泛型 Func<object, string, bool> filter

    Func<object, string, bool>是泛型,你可以先把他看成一个普通类型,比如stringpublic class Func{ } // 自定义个普通类. Func fil ...

  4. Chapter 2 Open Book——26

    "Oh." He let it drop. I looked away awkwardly. 哦,他让它走了.我笨拙的看向别处. "哦."他不再纠缠于这个问题. ...

  5. [妙味JS基础]第十一课:字符串、查找高亮显示

    知识点总结 字符串方法 var str = '2014年新春快乐哈' * length 字符串长度 str.length =>10 ------------------------------- ...

  6. [妙味DOM]第四课:Event-事件详解2

    知识点总结 事件捕获 obj.addEventListener('click',fn,true) 从外往里 obj.addEventListener('click',fn,false) 从里往外(冒泡 ...

  7. PyConChina2016 北京站 献给Python开发者

    开源编程语言Python近年来在互联网.游戏.云计算.大数据.运维.企业软件等领域有非常多的应用.今天小编就为大家推荐一场Python开发者的盛会:PyConChina2016(北京)! PyCon大 ...

  8. Sass入门:第一章

    1.什么是预处理器? CSS预处理器是用一种专门的编程语言,进行Web页面样式设计,然后再编译成正常的CSS文件,以供项目使用.CSS预处理器为CSS增加一些编程的特性,无需考虑浏览器的兼容性问题. ...

  9. 关于ApkTool不同版本在重新打游戏包时候的区别

    在工作中由于使用到将游戏CP提供的apk包重新反编译,然后二次签名出包,所以遇到了一个奇怪的bug. 下面是CP提供的apk包,将近358M 但是在重新编译之后,包变成了250M左右的apk包,虽然可 ...

  10. 分享到QQ空间、新浪微博、腾讯微博和人人网

    function shareys(type, url, title, img, content) { switch (type) { case "sina": url = &quo ...