使编辑器将十进制值呈现为类型="text"而不是类型="number"

Question

我在模型类中有两个属性：

public int? IntTest { get; set; }
public decimal? DecimalTest { get; set; }

然后我用：

@Html.EditorFor(model => model.IntTest, new { htmlAttributes = new { @class = "form-control"} })
@Html.EditorFor(model => model.DecimalTest, new { htmlAttributes = new { @class = "form-control"} })

我希望它们都呈现为类型为数字的 html 输入，但十进制没有，我得到：

<input class="form-control text-box single-line" data-val="true" data-val-number="The field IntTest must be a number." id="IntTest" name="IntTest" type="number" value="" />
<input class="form-control text-box single-line" data-val="true" data-val-number="The field IntTest must be a number." id="DecimalTest" name="DecimalTest" type="text" value="" />

十进制值呈现为type="text"，而 int 注册为type="number"。

这个问题意味着这不是预期的行为，所以我做错了什么吗？

如果这是预期的行为，有没有办法改变EditorFor将所有小数呈现为type="number"，而不必在每个小数字段的htmlAttributes中添加type = "number"？

Answer 1

您看到的 html 是默认行为。EditorFor()方法使用模板帮助程序.cs中定义的默认模板(除非您已为类型创建自定义EditorTemplate(。

对于 typeofint(以及byte和long(，它使用NumberInputTemplate，对于 typeofdecimal，它使用DecimalTemplate。这些模板在 DefaultEditorTemplates 中定义.cs用于decimal

internal static string DecimalTemplate(HtmlHelper html)
{
if (html.ViewContext.ViewData.TemplateInfo.FormattedModelValue == html.ViewContext.ViewData.ModelMetadata.Model)
{
html.ViewContext.ViewData.TemplateInfo.FormattedModelValue = String.Format(CultureInfo.CurrentCulture, "{0:0.00}", html.ViewContext.ViewData.ModelMetadata.Model);
}
return StringTemplate(html);
}

这反过来又调用

internal static string StringTemplate(HtmlHelper html)
{
return HtmlInputTemplateHelper(html);
}

和int

internal static string NumberInputTemplate(HtmlHelper html)
{
return HtmlInputTemplateHelper(html, inputType: "number");
}

请注意，NumberInputTemplate将inputType定义为"number"，它添加了type="number"属性，其中 asStringTemplate使用生成type="text"的默认inputType。

要为decimal添加type="number"，则需要手动添加属性，使用任一

@Html.EditorFor(m => m.DecimalTest, new { htmlAttributes = new { type = "number", @class = "form-control"} })

或

@Html.TextBoxFor(m => m.DecimalTest, new { type = "number", @class = "form-control"})

另一种方法是在/Views/Shared/EditorTemplates/Decimal.cshtml中为类型decimal创建自定义EditorTemplate，例如

@model decimal?
@{
var attributes = HtmlHelper.AnonymousObjectToHtmlAttributes(ViewData["htmlAttributes"]);
if (!attributes.ContainsKey("type"))
{
attributes.Add("type", "number");
}
string formatString = ViewData.ModelMetadata.DisplayFormatString ?? "{0:N2}";
}
@Html.TextBoxFor(m => m, formatString , attributes)

并在主视图中使用

@Html.EditorFor(model => model.DecimalTest, new { htmlAttributes = new { @class = "form-control"} })

另一种选择是创建自己的HtmlHelper扩展方法(例如@Html.DecimalFor(...)(来生成html。