2017-09-26 127 views
1

我正在創建一個使用Kendo驗證的MVC頁面。MVC - 如果在正則表達式驗證失敗時不希望我的電子郵件字段顯示錯誤,該怎麼辦?

我有以下型號:

public class ForgotPasswordModel 
{ 
    [Required(ErrorMessage = " ")] 
    public string UserName { get; set; } 

    [Required(ErrorMessage = " ")] 
    [EmailAddress(ErrorMessage = " ")] 
    public string Email { get; set; } 

    public string PhoneNumber { get; set; } 

    [Required(ErrorMessage = " ")] 
    public string Code { get; set; } 
} 

我不希望我的視圖來顯示錯誤信息的電子郵件字段。我希望它在驗證失敗時只顯示驚歎號。

目前我有在我看來,下面的代碼:

@model Site.Models.ForgotPasswordModel 

@{ 
    ViewBag.Title = "Forgot Password"; 
    Layout = null; 
} 

<!DOCTYPE html> 

<html> 
<head> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <meta http-equiv="X-UA-Compatible" content="IE=Edge"> 
    <meta name="viewport" content="width=device-width" /> 
    <title>Login</title> 

    <link href="~/Content/Site.css" rel="stylesheet" type="text/css" /> 
    <link href="~/Content/bootstrap.min.css" rel="stylesheet" type="text/css" /> 

    <script src="~/Scripts/jquery-3.1.1.min.js"></script> 
    <script src="~/Scripts/bootstrap.min.js"></script> 

    <link href="~/Content/kendo/kendo.common-material.min.css" rel="stylesheet" /> 
    <link href="~/Content/kendo/kendo.custom.css" rel="stylesheet" /> 
    <link href="~/Content/kendo/custom.css" rel="stylesheet" /> 

    <script src="~/Scripts/kendo/kendo.all.min.js"></script> 
    <script src="~/Scripts/kendo/kendo.aspnetmvc.min.js"></script> 


    <script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script> 
    <script src="~/Scripts/jquery.validate.min.js"></script> 
    <script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script> 

    <style> 
     input[type=text]::-ms-clear { 
      display: none; 
     } 

     input[type=password]::-ms-reveal { 
      display: none; 
     } 

     .errMsg { 
      font-weight: bolder; 
      color: red; 
     } 

     span#UserName_validationMessage, span#Email_validationMessage,span#Code_validationMessage { 
      display: inline-block; 
      width: 160px; 
      text-align: left; 
      border: 0; 
      padding: 0; 
      margin: -20px; 
      background: none; 
      box-shadow: none; 
      color: red; 
     } 

     .k-invalid-msg { 
      display: none; 
     } 
    </style> 

</head> 
<body> 
    <div> 
    </div> 
    <div style="margin-top: 20px;"> 
     <div style="margin: 0 auto; width: 940px; height: 409px; background-image: url('../../Content/images/finance-globe.jpg');"/> 
      @using (Html.BeginForm(null, null, FormMethod.Post, new { id = "ForgotPasswordForm" })) 
      { 
       <div style="margin: 0 auto; margin-top: 20px;"> 
        <table id="ForgotPassword" style="margin: 0" auto;"> 
         <tr style="height:40px;"> 
          <td>@Html.EditorFor(x => x.UserName, new { htmlAttributes = new { @class = "form-control k-textbox checkError", placeholder = "username" } })</td> 
         </tr> 
         <tr style="height:40px;"> 
          <td>@Html.EditorFor(x => x.Email, new { htmlAttributes = new { @class = "form-control k-textbox checkError", placeholder = "email" } })</td> 
         </tr> 
         <tr style="height:40px;"> 
          <td>@Html.EditorFor(x => x.PhoneNumber, new { htmlAttributes = new { @class = "form-control k-textbox", placeholder = "phone number" } })</td> 
         </tr> 
         <tr style="height:40px;"> 
          <td>@Html.EditorFor(x => x.Code, new { htmlAttributes = new { @class = "form-control k-textbox checkError", placeholder = "code" } })</td> 
         </tr> 
        </table> 
       </div> 
      } 
    </div> 
</body> 
</html> 

<script> 
    $(document).ready(function() { 
     $("#ForgotPasswordForm").kendoValidator(); 
    }); 
</script> 

模型和視圖產生如下:

enter image description here

我不想「電子郵件地址無效」消息在正則表達式驗證失敗的情況下顯示。

我只需要一個感嘆號。

我該怎麼做?

回答

0

對於您的電子郵件字段,您可以嘗試添加data-email-msg屬性,這是爲錯誤的電子郵件字段值自定義驗證消息的方法。

對於例如:如果你想顯示的電子郵件ID錯誤的值,你可以這樣做一個空白消息:

<input type="email" name="email" id="email" name="email" data-email-msg=""> 

如果你想定製required field validation message過,那麼你可以添加一個又一個屬性data-required-msg如下:

<input type="email" name="email" id="email" name="email" data-email-msg="" data-required-msg=""> 
相關問題