HtmlHelper:Form表单和自定义

生成Form

MVC使用了using界定form表单范围:

@using (Html.BeginForm()) { }

BeginForm()方法可以重载,通过参数指定Action/Controller/Method等,比如:

@form表单会用Get方法提交到HomeController下的Index()处理(/Home/Index),还带着routeData(id=3)@ @using (Html.BeginForm("Index", "Home", new { id = 3 }, FormMethod.Get))

实现方法是生成相应的HTML form表单:

默认是用Post提交到当前页面。

输入类@Html

包括:

  • 单行文本框(input type="text")

    @Html.TextBoxFor(m => m.Name)

  • 密码框 (input type="password")

    @Html.PasswordFor(m => m.Password)

  • 多行文本框(textarea)

    @Html.TextArea("SelfIntroduction")

和RazorPage类似,MVC会根据指定的Model属性生成表单。

注意form里面@Html引导的控件,都有两种形式:

  • 后缀为For:用Lambda表达式传递相应的Model属性,控件的name和id由属性名生成,因为能得到智能提示和编译时检查,总是推荐使用
  • 没有For后缀:用字符串指定生成控件的name和id。除非特殊情况,不推荐使用

另外,label也由HtmlHelper方法生成:

@Html.LabelFor(m => m.Name)

但作用不大,以为填充label的是属性名(英文Name),要使用自定义的文字,需要在Model属性上添加:

[Display(Name = "用户名")] public string Name { get; set; }

stringFormat

当Model中属性有值的时候,HTML页面会予以呈现。

这时在TextBoxFor()中还可以传一个参数format,可以决定textbox的呈现格式。比如:

@Html.TextBoxFor(m => m.BirthDay, "{0:D}")

就会让文本框中日期格式变为:

更多格式可参见Microsoft Doc

[](https://docs.microsoft.com/zh...,和RazorPage一样,注意DateTime?_(可空)_和DateTime_(非可空)_默认值的区别。_(复习)_

演示:略

参数htmlAttributes

所有的HtmlHelper都可以传这个参数。通常用匿名类_(也可以用IDictionary,都是“键值对”)_赋值:

object htmlAttributes IDictionary htmlAttributes

MVC会将其转换成HTML标签的属性。

@Html.TextBoxFor(m => m.Name, new { style = "background-color:blue;", //正常使用 @class = "form-control", zyf_username_duplicated = /null/ string.Empty })

说明:

  • 因为@class是关键字,所以要加一个@符号,MVC会在生成HTML标签属性时自动将其去掉_(类似的还有checked等)_
  • 因为C#语法中属性名不能有中划线,所以要用下划线代替,MVC会在生成HTML标签属性时自动将其转换成中划线
  • 匿名对象的属性值不能为null值,所以用string.Empty代替

演示:略

选择类@Html

RadioButton

生成单选框(input type="radio")

Model中对应的常常是bool值或枚举:

public bool? IsMale { get; set; }

注意页面加载时radio的“默认选中”由以下规则确定:

  • 如果RadioButtonFor()中没有由htmlAttributes指定checked
    如果IsMale没有被赋值如果IsMale是可空类型,所有radio都不会被选中否则
    否则,IsMale已经被赋值,则根据赋值确定谁被选中
  • 否则,

注意不传值和传空值(new Model())的区别:

return PartialView(new IndexModel()); return PartialView();

当new IndexModel()会给model中的值类型属性赋默认值,如 bool IsMale = false,从而影响比如radio/checkbox的呈现。

Checkbox

生成复选框(input type="checkbox")。

和radio类似。但是,方法()中的参数需要的是返回值为bool

DropdownList

复习SelectList

  • 数组
  • Dictionary
  • List

星座/生日的options需要放在Model中么?

EnumDropdownList

添加[Display()]

(_演示:,略_)

自定义

参照

public static MvcHtmlString CheckBoxFor( this HtmlHelper htmlHelper, Expression> expression)

添加一个返回值为MvcHtmlString的扩展方法

public static MvcHtmlString LinkFor( this HtmlHelper htmlHelper, Expression> expression) { //取出Model对象 Func func = expression.Compile(); TProperty property = func(htmlHelper.ViewData.Model); //拼凑html元素 string output = $"{property}"; //返回MvcHtmlString对象 return new MvcHtmlString(output); }

你可能感兴趣的:(jquery)