MVC DropDownListFor và StringLength thuộc tính không chơi tốt với nhau

Question

Xác nhận độ dài chuỗi của tôi luôn thất bại trên danh sách thả xuống với một giá trị chuỗi.

Đây là mô hình của tôi:

[Required(ErrorMessage = "Required")] 
[StringLength(2, MinimumLength = 2)] 
[Display(Name = "Home Address State")] 
public string HomeAddressState { get; set; } 

Đây là quan điểm của tôi:

@Html.DropDownListFor(model => model.HomeAddressState, new SelectList(ViewBag.States, "Value", "Text"), string.Empty) 
@Html.ValidationMessageFor(model => model.HomeAddressState) 

Đây là kết quả html:

<select data-val="true" data-val-length="The field Home Address State must be a string with a minimum length of 2 and a maximum length of 2." data-val-length-max="2" data-val-length-min="2" data-val-required="Required" id="HomeAddressState" name="HomeAddressState"><option value=""></option> 
<option value="CA">California</option> 
<option value="IL">Illinois</option> 
<option value="IN">Indiana</option> 
<option value="OH">Ohio</option> 
</select> 

Không có vấn đề gì tùy chọn được chọn, StringLength xác thực thất bại phía máy khách. Tôi đang làm gì sai?

Answer 1

vì StringLength khớp với quy tắc rangelength trong jquery.validate. Trong trường hợp danh sách lựa chọn, nó sẽ kiểm tra số lượng mục được chọn không phải là độ dài của giá trị được lựa chọn vì vậy nếu bạn viết một quy tắc có độ dài tối thiểu là 1, nó sẽ hoạt động

Answer 2

Đây là mã xác nhận hợp lệ. Như bạn có thể thấy, có vẻ như nó áp dụng xác nhận độ dài cho số tùy chọn được chọn, không phải độ dài của tùy chọn. Dường như chỉ áp dụng cho hộp danh sách đa lựa chọn. Loại kỳ quặc, thành thật.

maxlength: function(value, element, param) { 
    return this.optional(element) || this.getLength($.trim(value), element) <= param; 
} 

getLength: function(value, element) { 
    switch(element.nodeName.toLowerCase()) { 
     case 'select': 
      return $("option:selected", element).length; 
     case 'input': 
      if(this.checkable(element)) 
       return this.findByName(element.name).filter(':checked').length; 
    } 
    return value.length; 
} 

Những gì bạn có thể làm là ghi đè lên getLength chức năng chính mình để chỉ trả value.length trực tiếp.

$.validator.prototype.getLength = function (value, element) { 
    return value.length; 
} 

Answer 3

Để tránh phá vỡ logic cho các hộp kiểm và nhiều selectboxes, bạn có thể sử dụng:

$.validator.prototype.getLength = function (value, element) { 
    switch (element.nodeName.toLowerCase()) { 
     case 'select': 
      { 
       var attr = $(this).attr('multiple'); 
       // For some browsers, `attr` is undefined; for others, 
       // `attr` is false. Check for both. 
       if (typeof attr !== 'undefined' && attr !== false) { 
        return $("option:selected", element).length; 
       } 
      } 
     case 'input': 
      if (this.checkable(element)) 
       return this.findByName(element.name).filter(':checked').length; 
    } 
    return value.length; 
} 

CẢNH BÁO: Tôi đã thử nghiệm này chỉ trên DropDownFor, vì vậy sử dụng có nguy cơ của riêng bạn ....