如何實現在接受多個電子郵件字段MVC不顯眼的驗證解決

Question

我創造了銷售團隊的一個MVC Web應用程序使用進入前景到系統中，同時向他們發送跟進消息。其中一個要求是發送能力上的消息抄送多前景。

應用程序的其餘部分使用諸如「電子郵件」，它適用於標準的HTML5輸入類型大不顯眼的驗證了。問題是，沒有一個標準的輸入類型，它會自動驗證多個電子郵件地址，就像您在電子郵件應用程序中看到。

Answer 1

的解決方案是創建的自定義驗證屬性，並與客戶端註冊，以便它可以被不顯眼地驗證。

1. 創建自定義的驗證屬性：

   using System.Collections.Generic; 
   using System.ComponentModel.DataAnnotations; 
   using System.Web.Mvc; 
   
   namespace CustomValidation.BLL { 
       public class MultiEmailValidator : ValidationAttribute, IClientValidatable{ 
   
        protected override ValidationResult IsValid(object value, ValidationContext validationContext) { 
         return new ValidationResult(""); 
        } 
   
        public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context) { 
         ModelClientValidationRule mvr = new ModelClientValidationRule(); 
         mvr.ErrorMessage = "Enter valid email addresses separated by semi-colons."; 
         mvr.ValidationType = "multiemail"; 
   
         return new[] { mvr }; 
        } 
       } 
   } 
   

2. 註冊自定義的驗證在客戶端：

   $(function() { 
       jQuery.validator.addMethod('multiemail', function (value, element, params) {    
        // emails should be separated by either ';' or ',' 
        var email = value.split(/[;,]+/); 
        valid = true; 
   
        // call the standard jquery validator method on each email entered 
        for (var i in email) { 
         value = email[i]; 
         valid = valid && jQuery.validator.methods.email.call(this, $.trim(value), element); 
        } 
        return valid; 
       }, ''); 
   
       jQuery.validator.unobtrusive.adapters.add('multiemail', function (options) { 
        options.rules['multiemail'] = {}; 
        options.messages['multiemail'] = options.message; 
       }); 
   }(jQuery)); 
   

3. 套裝屬性型號：

   [Display(Name = "Carbon Copy")]   
   [MultiEmailValidator] 
   public string CarbonCopy { get; set; } 
   

4. 添加輸入到視圖：

   <div class="form-group col-lg-10"> 
       @Html.LabelFor(p => p.CarbonCopy, new { @class = "sr-only" }) 
   
       @Html.TextBoxFor(p => p.CarbonCopy, new { @class = "form-control input-sm", @placeholder = "Carbon Copy" }) 
   
       @Html.ValidationMessageFor(p => p.CarbonCopy) 
   </div> 
   

結果： Invalid Emails

結果： Valid Emails