TextBoxFor 与 EditorFor，以及 htmlAttributes 与 AdditionalViewData

Question

我创建了一个默认的 MVC 3 项目（使用 razor），以演示一个问题。

在登录页面，有一行：

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

如果我将其更改为：

@Html.TextBoxFor(m => m.UserName, new { title = "ABC" })

然后它被渲染为（带有标题属性）：

<input data-val="true" data-val-required="The User name field is required." id="UserName" name="UserName" title="ABC" type="text" value="" />

但是，如果我将其设为 EditorFor：

 @Html.EditorFor(m => m.UserName, new { title = "ABC" })

然后它被渲染（没有标题属性）为：

<input class="text-box single-line" data-val="true" data-val-required="The User name field is required." id="UserName" name="UserName" type="text" value="" />

所以总而言之，当我使用 EditorFor 时，title 属性会丢失。

我知道 TextBoxFor 的第二个参数称为 htmlAttributes，EditorFor 的第二个参数称为 AdditionalViewData，但是我已经看到 EditorFor 可以呈现随此参数提供的属性的示例。

谁能解释我做错了什么，以及在使用 EditorFor 时如何拥有 title 属性？

Answer 1

我想我找到了一个更好的解决方案。 EditorFor 接受 AdditionalViewData 作为参数。如果你给它一个名为“htmlAttributes”的参数和属性，那么我们可以用它做一些有趣的事情：

@Html.EditorFor(model => model.EmailAddress,
                new { htmlAttributes = new { @class = "span4",
                                             maxlength = 128,
                                             required = true,
                                             placeholder = "Email Address",
                                             title = "A valid email address is required (i.e. user@domain.com)" } })

在模板（在本例中为 EmailAddress.cshtml）中，您可以提供一些默认属性：

@Html.TextBox("",
              ViewData.TemplateInfo.FormattedModelValue,
              Html.MergeHtmlAttributes(new { type = "email" }))

魔法通过这个辅助方法聚集在一起：

public static IDictionary<string, object> MergeHtmlAttributes<TModel>(this HtmlHelper<TModel> htmlHelper, object htmlAttributes)
{
    var attributes = htmlHelper.ViewData.ContainsKey("htmlAttributes")
                            ? HtmlHelper.AnonymousObjectToHtmlAttributes(htmlHelper.ViewData["htmlAttributes"])
                            : new RouteValueDictionary();

    if (htmlAttributes != null)
    {
        foreach (PropertyDescriptor property in TypeDescriptor.GetProperties(htmlAttributes))
        {
            var key = property.Name.Replace('_', '-');
            if (!attributes.ContainsKey(key))
            {
                attributes.Add(key, property.GetValue(htmlAttributes));
            }
        }
    }

    return attributes;
}

当然，如果您使用的是原始 HTML，您也可以修改它以呈现属性：

public static MvcHtmlString RenderHtmlAttributes<TModel>(this HtmlHelper<TModel> htmlHelper, object htmlAttributes)
{
    var attributes = htmlHelper.ViewData.ContainsKey("htmlAttributes")
                            ? HtmlHelper.AnonymousObjectToHtmlAttributes(htmlHelper.ViewData["htmlAttributes"])
                            : new RouteValueDictionary();

    if (htmlAttributes != null)
    {
        foreach (PropertyDescriptor property in TypeDescriptor.GetProperties(htmlAttributes))
        {
            var key = property.Name.Replace('_', '-');
            if (!attributes.ContainsKey(key))
            {
                attributes.Add(key, property.GetValue(htmlAttributes));
            }
        }
    }

    return MvcHtmlString.Create(String.Join(" ",
        attributes.Keys.Select(key =>
            String.Format("{0}=\"{1}\"", key, htmlHelper.Encode(attributes[key])))));
}

Answer 2

在 MVC3 中，如果您创建自定义 EditorFor 模板，则可以使用这种解决方法添加标题（和其他 htmlAttributes）。这种情况下的值是可选的，editorFor调用不需要包含object additionalViewData

@Html.EditorFor(m => m.UserName, "CustomTemplate", new { title = "ABC" })

EditorTemplates/CustomTemplate.cshtml

@{
    string s = "";
    if (ViewData["title"] != null) {
        // The ViewData["name"] is the name of the property in the addtionalViewData...
        s = ViewData["title"].ToString();
    }
}

@Html.TextBox("", ViewData.TemplateInfo.FormattedModelValue, new { title = s })

我做了一些非常相似的事情，在 EditorTemplate 中包含一个可选类。您可以根据需要向 addtionalViewData 添加任意数量的项目，但您需要在 EditorFor 模板中处理每个项目。

Answer 3

您可以查看following blog post，它说明了如何实现自定义元数据提供程序并在您的视图模型上使用数据注释来定义 html 属性，例如class、maxlength、title、 ...这可以与模板化帮助器一起使用。