Razor及HtmlHelper学习笔记
Razor 不是编程语言。它是服务器端标记语言。
什么是Razor?
Razor 是一种允许您向网页中嵌入基于服务器的代码(Visual Basic 和 C#)的标记语法。
当网页被写入浏览器时,基于服务器的代码能够创建动态内容。在网页加载时,服务器在向浏览器返回页面之前,会执行页面内的基于服务器代码。由于是在服务器上运行,这种代码能执行复杂的任务,比如访问数据库。
Razor 基于 ASP.NET,它为 web 应用程序的创建而设计。它拥有传统 ASP.NET 标记的能力,但更易使用,也更易学习。
当服务器读取这种页面后,在将 HTML 页面发送到浏览器之前,会首先运行 Razor 代码。这些在服务器上执行的代码能够完成浏览器中无法完成的任务,比如访问服务器数据库。服务器代码能够在页面被发送到浏览器之前创建动态的 HTML 内容。从浏览器来看的话,由服务器代码生成的 HTML 与静态 HTML 内容没有区别。
Razor语法
Razor 使用的语法与 PHP 和 ASP 相似。
- Razor 代码封装于 @{ ... } 中
- 行内表达式(变量和函数)以 @ 开头
- 代码语句以分号结尾
- 字符串由引号包围
- C# 代码对大小写敏感
- C# 文件的扩展名是 .cshtml
<!-- 单行代码块 -->
@{ var myMessage = "Hello World"; } <!-- 行内表达式或变量 -->
<p>The value of myMessage is: @myMessage</p> <!-- 多行语句代码块 -->
@{
var greeting = "Welcome to our site!";
var weekDay = DateTime.Now.DayOfWeek;
var greetingMessage = greeting + " Here in Huston it is: " + weekDay;
}
<p>The greeting is: @greetingMessage</p>
HTMLHelper(HTML帮助器)
HTML 帮助器用于修改 HTML 输出。类似 ASP.NET 中的 web form 控件,但是 HTML 帮助器更轻。与 web form 控件不同,HTML 帮助器没有事件模型和 view state。
@Html.ActionLink()
Razor语法:
@Html.ActionLink("Edit Record", "Edit", new {Id=3})
输出:
<a href="/Home/Edit/3">Edit Record</a>
@Html.TextBox
<!--Razor-->
@model Student
@Html.TextBox("StudentName", Model.StudentName, new { @class = "form-control" })
<!--输出-->
<input class="form-control" id="StudentName" name="StudentName" type="text" value="Janes" />
@Html.TextBoxFor
<!--Razor-->
@model Student
@Html.TextBoxFor(m => m.StudentName, new { @class = "form-control" })
<!--输出-->
<input class="form-control" id="StudentName" name="StudentName" type="text" value="Janes" />
TextBox和TextBoxFor的区别:
@Html.TextBox是一个弱类型,@Html.TextBoxFor()是个强类型。
@Html.TextBox参数是一个字符串,@Html.TextBoxFor参数是一个lambda表达式
@Html.TextBox如果属性拼写错误在编译的时候不会报错,只能在运行才会报错,@Html.TextBoxFor在编译的时候会提示错误。
@Html.TextArea
<!--Razor-->
@Html.TextArea("Textarea1", "val", 5, 15, new { @class = "form-control" })
<!--输出-->
<textarea class="form-control" cols="15" id="Textarea1" name="Textarea1" rows="5">val</textarea>
@Html.TextAreaFor
<!--Razor-->
@model Student
@Html.TextAreaFor(m => m.Description, new { @class = "form-control" })
<!--输出-->
<textarea class="form-control" cols="20" id="Description" name="Description" rows="2"></textarea>
@Html.Password
<!--Razor-->
@Html.Password("OnlinePassword")
<!--输出-->
<input id="OnlinePassword" name="OnlinePassword" type="password" value="" />
@Html.PasswordFor
<!--Razor-->
@model Student
@Html.PasswordFor(m => m.Password)
<!--输出-->
<input id="Password" name="Password" type="password" value="mypassword" />
@Html.Hidden
@Html.HiddenFor
@Html.CheckBox
<!--Razor-->
@Html.CheckBox("isNewlyEnrolled", true)
<!--输出-->
<input checked="checked" id="isNewlyEnrolled" name="isNewlyEnrolled" type="checkbox" value="true" />
@Html.CheckBoxFor
<!--Razor-->
@model Student
@Html.CheckBoxFor(m => m.isNewlyEnrolled)
<!--输出-->
<input data-val="true" data-val-required="The isNewlyEnrolled field is required." id="isNewlyEnrolled" name="isNewlyEnrolled" type="checkbox" value="true" />
<input name="isNewlyEnrolled" type="hidden" value="false" />
@Html.RadioButton
<!--Razor-->
Male: @Html.RadioButton("Gender","Male")
Female: @Html.RadioButton("Gender","Female")
<!--输出-->
Male: <input checked="checked" id="Gender" name="Gender" type="radio" value="Male" />
Female: <input id="Gender" name="Gender" type="radio" value="Female" />
@Html.RadioButtonFor
<!--Razor-->
@model Student
@Html.RadioButtonFor(m => m.Gender,"Male")
@Html.RadioButtonFor(m => m.Gender,"Female")
<!--输出-->
<input checked="checked" id="Gender" name="Gender" type="radio" value="Male" />
<input id="Gender" name="Gender" type="radio" value="Female" />
@Html.DropDownList
@Html.DropDownListFor
<!--Razor-->
@Html.DropDownListFor(m => m.StudentGender, new SelectList(Enum.GetValues(typeof(Gender))), "Select Gender")
<!--输出-->
<select class="form-control" id="StudentGender" name="StudentGender">
<option>Select Gender</option>
<option>Male</option>
<option>Female</option>
</select>
@Html.Display
@Html.DisplayFor
<!--Raozr-->
@model Student
@Html.DisplayFor(m => m.StudentName)
<!--输出-->
Steve
@Html.Label
@Html.LabelFor
<!--Razor-->
@model Student
@Html.LabelFor(m => m.StudentName)
<!--输出-->
<label for="StudentName">姓名</label>
@Html.Editor
@Html.EditorFor
该扩展方法是一种基于数据类型生成html输入元素的方法。Editor()或EditorFor()扩展方法基于Model对象的属性的数据类型生成html标签。
<!--Razor-->
StudentId: @Html.EditorFor(m => m.StudentId)
Student Name: @Html.EditorFor(m => m.StudentName)
Age: @Html.EditorFor(m => m.Age)
Password: @Html.EditorFor(m => m.Password)
isNewlyEnrolled: @Html.EditorFor(m => m.isNewlyEnrolled)
Gender: @Html.EditorFor(m => m.Gender)
DoB: @Html.EditorFor(m => m.DoB)
@Html.BegionForm
<!--Razor-->
@using (Html.BeginForm("ActionName", "ControllerName", FormMethod.Post, new { @class = "form" }))
{ }
<!--输出-->
<form action="/ControllerName/ActionName" class="form" method="post">
</form>
@Html.Action
执行一个Action,并返回HTMl字符串
@Html.RenderAction
Action是执行单独的控制器并且显示结果,Action返回的是字符串,而RenderAction是写入响应流
@Html.Action("MyMenu")
@{
Html.RenderAction("MyMenu");
}
@Url.Action
返回一个Action的链接地址
<!--Razor-->
Url.Action("someaction", "somecontroller", new { id = "123" })
<!--返回-->
/somecontroller/someaction/123
@Html.Partial 与 @Html.RenderPatial的区别
1. Razor语法不一样
@Html.Partial("PartialViewName")
@{ Html.RenderPartial("PartialViewName"); }
2. Partial有返回值(MvcHtmlString);RenderPartial没有返回值(Void)。
Partial是将视图内容直接生成一个字符串并返回(相当于有个转义的过程),RenderPartial方法是直接输出至当前 HttpContext,不进行缓存(因为是直接输出,所以性能好)。更多时候我们会使用 @{ Html.RenderPartial("Details"); } 而不是@Html.Partial
//PartialExtensions.Partial 方法 (HtmlHelper, String)
public static MvcHtmlString Partial(
this HtmlHelper htmlHelper,
string partialViewName
) //RenderPartialExtensions.RenderPartial 方法 (HtmlHelper, String)
public static void RenderPartial(
this HtmlHelper htmlHelper,
string partialViewName
)
@Html.Partial 与 @Html.Action
@Html.Partial可以直接提供用户控件名作为参数,而@Html.Action需要有对应的Action,在Action内部返回PartialViewResult。
对于简单的没有任何逻辑的用户控件,推荐使用@Html.Partial;对于需要设置一些Model的用户控件,推荐使用@Html.Action。当然,有Model数据也是可以使用@Html.Partial方法的,有重载。
Action、RenderAction加载方法的视图,执行Controller → Model → View的顺序,然后把产生的页面带回到原来的View中再回传。而Partial、RenderPartial直接加载视图文件内容
Razor及HtmlHelper学习笔记的更多相关文章
- Asp.net core 2.0.1 Razor 的使用学习笔记(五)
按说这里应该写关于Role角色类的笔记,但是我还没时间实验这块,所以等以后我搞定了再来分享.现在先写其他部分. Asp.net core 2.0.1 Razor 的使用学习笔记——建立模型 按照微软官 ...
- Asp.net core 2.0.1 Razor 的使用学习笔记(六)
Asp.net core 2.0.1 Razor 的使用学习笔记——基本页面的建立 VS这版(vs版本:15.5.6 .net版本:4.7.02558)的Razor页面自动生成就是坑爹货,它自动生成 ...
- Asp.net core 2.0.1 Razor 的使用学习笔记(一)
环境:vs2017 版本:15.5.6 一.新建项目 1.文件>新建>项目>Visual c#>.NET Core>ASP.NET Core Web应用程序(“.NET ...
- Asp.net core 2.0.1 Razor 的使用学习笔记(四)
ASP.net core 2.0.1 中 asp.net identity 2.0.1 的基本使用(三)—用户注册 一.修改用户注册 1.打开Pages文件夹>Account>Regist ...
- Asp.net core 2.0.1 Razor 的使用学习笔记(三)
ASP.net core 2.0.0 中 asp.net identity 2.0.0 的基本使用(二)—用户账户及cookie配置 修改用户账户及cookie配置 一.修改密码强度和用户邮箱验证规则 ...
- Asp.net core 2.0.1 Razor 的使用学习笔记(二)
ASP.net core 2.0.1 中 asp.net identity 2.0.1 的基本使用(一)—启用用户管理 一.修改和启用默认的用户账户管理和角色管理 在Data目录中添加Applicat ...
- ASP.NET MVC 学习笔记-2.Razor语法 ASP.NET MVC 学习笔记-1.ASP.NET MVC 基础 反射的具体应用 策略模式的具体应用 责任链模式的具体应用 ServiceStack.Redis订阅发布服务的调用 C#读取XML文件的基类实现
ASP.NET MVC 学习笔记-2.Razor语法 1. 表达式 表达式必须跟在“@”符号之后, 2. 代码块 代码块必须位于“@{}”中,并且每行代码必须以“: ...
- ASP.Net MVC开发基础学习笔记:一、走向MVC模式
一.ASP.Net的两种开发模式 1.1 ASP.Net WebForm的开发模式 (1)处理流程 在传统的WebForm模式下,我们请求一个例如http://www.aspnetmvc.com/bl ...
- ASP.Net MVC开发基础学习笔记(1):走向MVC模式
一.ASP.Net的两种开发模式 1.1 ASP.Net WebForm的开发模式 (1)处理流程 在传统的WebForm模式下,我们请求一个例如http://www.aspnetmvc.com/bl ...
随机推荐
- Hive配置文件中配置项的含义详解(收藏版)
这里面列出了hive几乎所有的配置项,下面问题只是说出了几种配置项目的作用.更多内容,可以查看内容 问题导读: 1.hive输出格式的配置项是哪个? 2.hive被各种语言调用如何配置? 3.hive ...
- Js/html格式化在线工具
Js/html格式化在线工具 Js/html格式化在线工具:http://tool.chinaz.com/Tools/jsformat.aspx
- 20145212罗天晨 逆向及Bof基础实践
20145212罗天晨<网络对抗>第1周学习总结--逆向及Bof基础实践 逆向及Bof基础实践 一.实践目标 1.运行原本不可访问的代码片段 2.强行修改程序执行流 3.以及注入运行任意代 ...
- java中年月日的加减法,年月的加减法使用
本文为博主原创,未经允许不得转载: java计算两个年月日之间相差的天数: public static int daysBetween(String smdate,String bdate) thro ...
- C指针 的一些练习
注:此篇是我使用指针敲的一些题目的集成,有一些代码是重复的(挠头).这样做的目的是进行前后的一些比较和收获一些心得(?). 关于上一次我上台的题目: 题目:输入十个整数,进行排序. 做法1:(传递指针 ...
- js中可以直接使用id而不用获取id
先来看一个例子: 不获取 id 也可以使用 id 元素. <!-- Author: XiaoWen Create a file: 2017-01-11 13:58:01 Last modifie ...
- 【咖啡の设备】便携式冰滴壶——Dripo 使用体验
--------------------------------------------2016.12.22 更新------------------------------------------- ...
- Z-score(Z值)的意义--转载
http://blog.sina.com.cn/s/blog_72208a6a0101cdt1.html http://www.docin.com/p-350677620.html http://we ...
- MongoVUE的Collections数据不显示的解决方法
问题描述: 使用 mongoDB数据库, 数据添加成功了,使用命令行能查询出来,但在MongoVUE 中数据却不显示 (我使用的是 mongoDB 3.4 的版本) 原因:引擎问题,只要降到2.X版 ...
- Yandex.Algorithm 2011 Round 2 D. Powerful array 莫队
题目链接:点击传送 D. Powerful array time limit per test 5 seconds memory limit per test 256 megabytes input ...