ASP.NET MVC 3 Client Validation

Question

У меня есть следующий ViewModel:

public class ViewModel 
{ 
    [Display(Name = "firstname", ResourceType = typeof(Views.Validation))] 
    public string firstname { get; set; } 

    [Required(ErrorMessageResourceName="required", ErrorMessageResourceType = typeof(Views.Validation))] 
    [Display(Name="lastname", ResourceType = typeof(Views.Validation))] 
    public string lastname { get; set; } 

    ... 
} 

и мой взгляд HTML:

... 
<div class="row valid showMsg"> 
    <div class="itemWrap clearfix"> 
     <label>@Html.LabelFor(model => model.firstname)<span class="iconReq">&nbsp;</span>:</label> 
     @Html.EditorFor(model => model.firstname) 
    </div> 
    <div class="info"> 
     <p class="errorMsg">@Html.ValidationMessageFor(model => model.firstname)</p> 
     <p class="infoMsg">info message here</p> 
     <p class="focusMsg">text on active</p> 
    </div> 
</div> 
... 

Если вы заметили, на мой взгляд, HTML у меня есть <div class="row valid showMsg"> с классом " showMsg ", который управляет отображением сообщений внутри моего <div class="info">.

Теперь для проверки сервера я написал пользовательский помощник HTML, который добавляет, что этот класс «showMsg» в DIV, когда не действует так:

public static MvcHtmlString ValidationRowFor<TModel, TProperty>(this HtmlHelper<TModel> html, Expression<Func<TModel, TProperty>> expression) 
{ 
    MvcHtmlString normal = html.ValidationMessageFor(expression); 

    if (normal != null) 
    { 
     return MvcHtmlString.Create("errorOn"); 
    } 

    return null; 
} 

и использовать его как так:

<div class="row valid @Html.ValidationRowFor(model => model.firstname)"> 

Я хотел бы сделать то же самое для проверки клиента. Так что он автоматически добавит класс showMsg к родительскому объекту при ошибке. Как мне это сделать?

Спасибо.

Редактировать: ok это работает для обычного HTML, но не в MVC3 ??

$(function(){ 
var validator = $(".form").validate({ 
      highlight: function(element) { 
      $(element).parents().closest('div.row').addClass('errorOn'); 
      }, 

      unhighlight: function(element) { 
      $(element).parents().closest('div.row').removeClass('errorOn'); 
      } 
}); 
}); 

Answer 1

Может быть что-то между строками должно сделать работу:

$(function() { 
    $('form').submit(function() { 
     $(this).validate().invalidElements().each(function() { 
      $(this).closest('div.row.valid').addClass('showMsg'); 
     }); 
    }); 
}); 

Answer 2

при использовании правил проверки JQuery, вы можете что-то вроде этого (я получаю этот код из моего проекта, я изменить то, что вы необходимо, errorClass:

var contactsRules = { 
    errorClass: 'showMsg', 
    rules: { 
     Name: { required: true }, 
     Surname: { required: true }, 
     Email: { required: true, email: true } 
    }, 
    messages: { 
     Name: { 
      required: '<p class="errore">*</p>' 
     }, 
     Surname: { 
      required: '<p class="errore">*</p>' 
     }, 
     Email: { 
      required: '<p class="errore">*</p>', 
      email: '<p class="errore">*</p>' 
     } 
    } 
} 

Я полагаю, у вас есть форма под названием "контакт", создать JS-файл с этим кодом:

$(document).ready(function() { 
    var contactRules = ... //The code posted before this 
    $('#contact').validate(contactRules); 

    $('#contact').submit(function() { 
     return $(this).validate(); 
    }); 
}); 

Я надеюсь, что это может помочь