如何在 mvc 4 中自动将占位符属性添加到 html 输入类型编号？

Posted 2023-03-05

【中文标题】如何在 mvc 4 中自动将占位符属性添加到 html 输入类型编号？

【英文标题】：How to automatically add placeholder attribute to html input type number in mvc 4?

【发布时间】：2013-01-12 06:30:49

【问题描述】：

这是一个非常具体的问题。我设法使用名为EmailAddress.cshtml 的编辑器模板自动将占位符属性添加到html5 电子邮件输入类型，该模板保存在~/Views/Shared/EditorTemplates/ 文件夹中。请看下面的代码：

@Html.TextBox("", ViewData.TemplateInfo.FormattedModelValue, new  @class = "text-box single-line", placeholder = ViewData.ModelMetadata.Watermark )

因为我在我的视图模型中使用了[DataType(DataType.EmailAddress)] DataAnnotation，所以它可以工作。

当我使用 int? 变量时不起作用。

public class MiageQuotaRequestViewModel

    [Required]
    [DataType(DataType.EmailAddress)]
    [Display(Name = "Nombre de place demandées", Prompt = "Nombre de place")]
    [Range(0, 50, ErrorMessage = "La demande doit être comprise entre 0 et 50 places")]
    public int? RequestedQuota  get; set; 

@Html.EditorFor 像这样翻译这个输入：

<input class="text-box single-line" data-val="true" data-val-number="The field Nombre de place demandées must be a number." data-val-range="La demande doit être comprise entre 0 et 50 places" data-val-range-max="50" data-val-range-min="0" data-val-required="Le champ Nombre de place demandées est requis." id="RequestedQuota" name="RequestedQuota" type="number" value="">

问题是我无法显示Prompt DataAnnotation（通常由placeholder 翻译）。此外，DataType 枚举没有任何“数字”或“整数”值可以让我像使用 EmailAddress 数据类型一样使用 EditorTemplate。

【问题讨论】：

为什么电子邮件地址是 Nullable 类型的？

我可能解释错了。电子邮件部分是有效的示例。第二部分（带int？）是什么。电子邮件的类型是这样的字符串：[Required, MaxLength(100), DataType(DataType.EmailAddress), Display(Name = "Adresse e-mail", Prompt = "Votre adresse e-mail"), Email(ErrorMessage = "Adresse e-mail invalide")]public string EmailAddress get; set;

所以目标是获得正确的编辑器模板来使用？如果是这样，您可以使用 [UIHint] 属性向 Razor 指定您要使用的模板：msdn.microsoft.com/en-us/library/…

你签出***.com/questions/7760599/…了吗？

【参考方案1】：

基于Pat Burke评论，我可以使用UIHint数据属性结合好的编辑器模板。

这是一个示例 (Editor Template)：

@Html.TextBox("", ViewData.TemplateInfo.FormattedModelValue, new  @class = "text-box single-line", placeholder = ViewData.ModelMetadata.Watermark, type = "number" )

(ViewModel)

public class MiageQuotaRequestViewModel

    [Required]
    [UIHint("Number")]
    [DataType(DataType.EmailAddress)]
    [Display(Name = "Nombre de place demandées", Prompt = "Nombre de place")]
    [Range(0, 50, ErrorMessage = "La demande doit être comprise entre 0 et 50 places")]
    public int? RequestedQuota  get; set; 

最后是结果：

<input class="text-box single-line" 
    data-val="true"
    data-val-number="The field Nombre de place demandées must be a number."
    data-val-range="La demande doit être comprise entre 0 et 50 places"
    data-val-range-max="50"
    data-val-range-min="0"
    data-val-required="Le champ Nombre de place demandées est requis."
    id="RequestedQuota"
    name="RequestedQuota"
    placeholder="Nombre de place"
    type="number"
    value="">

【讨论】：

如果那是您的编辑器模板，那么您的模型属性完全没有任何作用。