电子邮件数据注释验证有效，但电话无效答案

【问题标题】：Email data annotation validation works but Phone doesn't电子邮件数据注释验证有效，但电话无效
【发布时间】：2013-11-12 16:08:05
【问题描述】：

我在我的 ASP.NET MVC4 项目中使用数据注释对电子邮件和电话字段执行客户端验证。电子邮件在客户端中成功验证，但手机没有 - 它允许我输入无效字符，并且只在提交表单时警告我（而不是在输入字符后立即）

在模型中：

[Required(ErrorMessage = "Email is required")]
[DataType(DataType.EmailAddress)]
[EmailAddress]
[Display(Name = "Email")]
public string Email{ get; set; }

[Required(ErrorMessage = "Mobile is required")]
[DataType(DataType.PhoneNumber)]
[Phone]
[Display(Name = "Mobile number")]
public string Mobile { get; set; }

在我看来，我认为我包含了正确的脚本引用：

<script type="text/javascript" src="~/Scripts/jquery.validate.min.js" ></script
<script type="text/javascript" src="~/Scripts/jquery.validate.unobtrusive.min.js" ></script>

..并使用 html 帮助程序（我使用的是 TextBoxFor 而不是 EditorFor，因为我正在应用类属性，为了清楚起见，我在此处省略了）

@Html.LabelFor(model => model.Email)
@Html.ValidationMessageFor(model => model.Email)
@Html.TextBoxFor(model => model.Email, new { @type = "email" })       

@Html.LabelFor(model => model.Mobile)
@Html.ValidationMessageFor(model => model.Mobile)
@Html.TextBoxFor(model => model.Mobile, new { @type = "phone" })

我错过了什么？

【问题讨论】：

标签： validation asp.net-mvc-4

【解决方案1】：

[Required(ErrorMessage = "Mobile is required")]
[RegularExpression(@"^\(?([0-9]{3})\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$", ErrorMessage = "Entered mobile format is not valid.")]
public string Mobile{get; set;}

它将匹配以下数字：0123456789、012-345-6789、(012)-345-6789 等。

【讨论】：

【解决方案2】：

MVC 4 有一个内置的电子邮件地址显示模板，但没有电话号码。您需要为[DataType(DataType.PhoneNumber)] 创建一个自定义的 DisplayTemplate。

添加以下文件（您可能需要创建子文件夹 DisplayTemplates）：
Views\Shared\DisplayTemplates\PhoneNumber.cshtml

@model System.String
@if (Model != null)
{
    @:@System.Text.RegularExpressions.Regex.Replace(@Model, "(\\d{3})(\\d{3})(\\d{4})", "$1-$2-$3")
}

【讨论】：

【解决方案3】：

我认为问题在于电话类型不受支持。见phone type support at w3schools

【讨论】：

也许最好询问 OP（使用评论）正在使用什么电话类型；它可能是受支持的类型，在这种情况下，这不是答案......
@OzAnt - 你是说我应该使用 new type = "tel" 而不是 type = "phone" 吗？？
@LiamWeston - 不完全是：w3schools 说 HTML5 定义了 type=tel 的电话输入类型，而不是电话，但是任何浏览器都不支持这种类型（因为我猜每个国家/地区的电话号码都不同)。因此，您最好在模型中使用自己的正则表达式验证您的电话号码并将其应用于客户端。看起来这更像是一个提示，因为 iPhone 可以识别 type="tel"，并将键盘完全更改为标准手机键盘，请参阅 [link]html5doctor.com/html5-forms-input-types/#input-tel
谢谢 - 这是我得出的结论。

【解决方案4】：

使用EditorFor insted of TextBoxFor for Email，然后它会在email字段中给出错误ok keyup。

【讨论】：

@Html.LabelFor(model => model.Email) @Html.ValidationMessageFor(model => model.Email) @Html.EditorFor(model => model.Email) 将此用于电子邮件验证