Javascript PhoneAttribute的MVC客户端验证

我有一个模型：

public class MyModel{
    [Phone]
    public string MyTel { get; set; }
}

他认为：

@model MyModel
@Html.EditorFor(x => x.MyTel)

生成的HTML：

<input type="tel" value="" name="MyTel" id="MyTel" data-val-phone="The MyTel field is not a valid phone number." data-val="true" class="text-box single-line"/>

MyTel字段的客户端验证不起作用。如何做到这一点？

由文章指导

---

我在PhoneAttribute项目中应用的最简单的解决方案：

步骤1:添加这些注释

public class MyModel{
    [Required(ErrorMessage = "You must provide a mobile number")]
    [Phone]
    [MaxLength(13)] //custom maximum length enabled
    [MinLength(10)]//custom minimum length enabled
    [RegularExpression("^[0-9]*$", ErrorMessage = "mobile number must be 
    numeric")]
    public string MyTel { get; set; }
} 

步骤2:添加这两个库

<script src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.13.1/jquery.validate.js"></script>
<script src="//ajax.aspnetcdn.com/ajax/mvc/5.2.3/jquery.validate.unobtrusive.js"></script>

步骤3:在appSettings add下的Web.config中

 <add key="ClientValidationEnabled" value="true"/>
 <add key="UnobtrusiveJavaScriptEnabled" value="true"/>

---

注意：不要混淆mvc html助手和原始html，它可能会禁用客户端验证。

谢谢。一条评论：我不认为这里应该有

if（this.optional（…）

检查。如果它是必需的，那么属性上还应该有一个

[required]

属性。按照现在的代码方式，将永远不会对非必需的属性进行验证，这很可能不是人们所期望的。如果我错了，请纠正我！此正则表达式不能正常工作。例如，

123

在不应该通过此测试的情况下通过了此测试。我最终将您的解决方案与此方案结合起来：

 <add key="ClientValidationEnabled" value="true"/>
 <add key="UnobtrusiveJavaScriptEnabled" value="true"/>