使 EditorFor 将十进制值呈现为 type="text" 而不是 type="number"

Question

我在模型中有两个属性 class:

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"，而整数被注册为type="number"。

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

如果这是预期的行为，是否有任何方法可以更改 EditorFor 以将所有小数呈现为 type="number"，而不必在 [=20= 中添加 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 定义为 "number"，它添加了 type="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.

使 EditorFor 将十进制值呈现为 type="text" 而不是 type="number"

Make EditorFor render decimal value as type="text" not type="number"

html-input

editorformodel

razor

asp.net-mvc-5