使 EditorFor 将十进制值呈现为 type="text" 而不是 type="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"。

This question 暗示这不是预期的行为，所以我做错了什么吗？

如果这是预期的行为，是否有任何方法可以更改 EditorFor 以将所有小数呈现为 type="number"，而不必在每个小数字段的 htmlAttributes 中添加 type = "number"？

Answer 1

您看到的 html 是默认行为。 EditorFor() 方法使用TemplateHelpers.cs 中定义的默认模板（除非您为该类型创建了自定义EditorTemplate）。

对于 typeof int（以及 byte 和 long），它使用 NumberInputTemplate，对于 typeof decimal，它使用 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 定义为添加type="number" 属性的"number"，而StringTemplate 使用默认的inputType 生成type="text"。

要为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 中为 typeof 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。