2014-09-13 73 views
0

所以我嘗試使用以下DataAnnotations:數據註釋不工作不顯眼的jQuery驗證在部分ASP.NET MVC

[Required(ErrorMessage = "A Description Is Required.")] 
    [StringLength(500, ErrorMessage = "The Description must be at least {2} characters long.", MinimumLength = 2)] 
    public string description { get; set; } 

的DataAnnotations填充在我<input />元素響應客戶對我的描述性數據屬性:

<input maxlength="500" class="form-control" data-val="true" data-val-length="The Description must be at least 2 characters long." data-val-length-max="500" data-val-length-min="2" data-val-required="A Description Is Required." id="Add_description" name="Add.description" required="required" type="text" value=""> 

我引用腳本/ JS庫:

jQuery Validation Plugin 1.13.1 
Microsoft jQuery Unobtrusive Validation 3.2.2 
Microsoft jQuery Unobtrusive Ajax 3.2.2 

我不確定我是否需要Microsoft jQuery Unobstrusive Ajax庫,但是我讀了answer,因爲我也在嘗試Range驗證,但它不起作用,但我將重點放在了爲此問題描述屬性的必需消息上,以保留它很簡單。

這裏是我查看代碼(請理解我的引導模式是HTML語法正確我剛纔排除一些我自舉模式HTML元素使代碼更易於讀取,我的問題):

@using (Html.BeginForm("CustomFieldAddNew", "CustomField", null, FormMethod.Post, new { @role = "form", id = "CustomFieldAddForm", enctype = "multipart/form-data" })) 
     { 
      @Html.HiddenFor(mi => mi.Add.custom_field_context_id) 

      <div class="modal-body"> 

       <div class="table-responsive"> 
        <table class="table table-striped table-bordered"> 
         <thead> 
          <tr> 
           <th colspan="2">General Information </th> 
          </tr> 
         </thead> 
         <tbody> 
          <tr> 
           <td> 
            <label for="">Description<i class="icon-asterisk"></i></label> 
           </td> 
           <td> 
            <div class="col-md-8 padding-0"> 
             @Html.TextBoxFor(mi => mi.Add.description, new { @class = "form-control", @MaxLength = "500", required = "required" }) 
             @Html.ValidationMessageFor(mi => mi.Add.description) 
            </div> 
           </td> 
          </tr> 
          </tbody> 
         </table> 
        </div> 
       </div> 
      </div> 
      <!-- /.modal-body --> 
      <div class="modal-footer"> 
       <button id="btnCloseSaveModal" type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
       <button id="btnCustomFieldSave" type="button" class="btn btn-primary">Save</button> 
      </div> 
     } 

<script> 
     $('#btnCustomFieldSave').on('click', function() { 
     var $form = $(this).parents('form'); 

     var postData = { 
      description: $('#@Html.IdFor(mi => mi.Add.description)').val() 
     } 

     if ($form.validate().form()) {//fire jQuery validation 
      $.ajax({ 
       type: "POST", 
       url: $form.attr('action'), 
       contentType:"application/json", 
       data: JSON.stringify(postData), 
       error: function (xhr, status, error) { 
        toastr.error("Error saving, please try again."); 
       }, 
       success: function (data) { 
        $('#customField').modal('toggle'); 
        $form.trigger("reset"); 
       } 
      }); 
     } 

     return false; 
    }); 
}); 
</script> 

我的客戶端驗證消息應該說:

"A Description Is Required." 

但是相反,當我點擊btnCustomFieldSave,和我的jQuery CLICK監聽功能火災和調用$ form.validate()驗證錯誤消息顯示「此網絡連接現場是必需的。「這是jQuery驗證插件1.13.1庫中的默認消息。

我的問題是,爲什麼我的DataAnnotation消息「需要說明的是必需的」,而取代罐頭jQuery驗證插件的消息不顯示「這是必須填寫」

注意,我是否包含了線@Html.ValidationMessageFor(mi => mi.Add.description)或不。我仍然看到「此字段是必需的」,而不是我在DataAnnotation屬性Required中定義的自定義消息,即「需要說明」

回答

4

因此,Microsoft jQuery Unobtrusive Validation已經解僱了它的解析並綁定到數據attrs我的部分表單內容已加載。

我需要再有微軟的jQuery不顯眼的驗證解析火,所以在底部我偏我說:

$(function() { 
     //Microsoft Unobtrusive jQuery validation has already binded so must kick off parse to bind partial loaded dynamic form 
     $.validator.unobtrusive.parse($('#CustomFieldAddForm')); 
}); 

我在這裏找到了答案:Data Annotations/Validation not working for partial views

相關問題