MVC3 - ненавязчивая проверка нескольких элементов управления

Question

Я создал функцию jQuery для ненавязчивой проверки MVC 3 ...

$.validator.addMethod('dtdt',
    function (value, element, parameters) {

        var idmonth = '#' + parameters['m'];
        var idyear = '#' + parameters['y'];
        var idhour = '#' + parameters['h'];
        var idminute = '#' + parameters['mn'];
        var controlmonth = $(idmonth);
        var controlyear = $(idyear);
        var controlhour = $(idhour);
        var controlminute = $(idminute);
        var mv = controlmonth.val();
        var yv = controlyear.val();
        var hv = controlhour.val();
        var mnv = controlminute.val();

        if (value == "" || mv == "" || yv == "" || hv == "" || mnv == "") 
            if (value != "" || mv != "" || yv != "" || hv != "" || mnv != "")
                return $.validator.methods.required.call(
                    this, value, element, parameters);

        return true;
    }
);

Идея заключается в том, что у меня есть 5 выпадающих элементов управления рядом друг с другом (день, месяц, год, час и минута). Я добавил этот валидатор в выпадающий список "День".

Правило таково: - Если один пустой, то все они должны быть пустыми. Если один заполнен, то все они должны быть заполнены.

Ниспадающее значение Day передается в функцию с помощью «value». Другие значения извлекаются непосредственно из элементов управления. Этот бит работает нормально.

Когда я отлаживаюсь, кажется, что код правильно вызывает оператор return $ .validator именно тогда, когда я этого ожидаю. Тем не менее, форма все еще представляется на серверную сторону. Единственное исключение, если это выпадающий день, который я оставил пустым. Если вместо этого я оставил поле «Месяц» пустым, средство проверки не работает.

То, что я хочу сделать, достижимо? Кажется излишним ставить этот валидатор на каждый из 5 элементов управления.

Answer 1

Проблема в том, что вы добавили этот валидатор в выпадающий список "День".Чтобы заставить его работать, он должен вызвать $ .validator.methods.required.call для правильного пустого элемента, примерно так:

if (value == "" || mv == "" || yv == "" || hv == "" || mnv == "") {
    if (value != "" || mv != "" || yv != "" || hv != "" || mnv != "") {
        if (value == "")
            $.validator.methods.required.call(this, value, element, parameters);
        if (mv == "")
            $.validator.methods.required.call(this, mv, controlmonth, parameters);
        if (yv == "")
            $.validator.methods.required.call(this, yv, controlyear, parameters);
        if (hv == "")
            $.validator.methods.required.call(this, hv, controlhour, parameters);
        if (mnv == "")
            $.validator.methods.required.call(this, mnv, controlminute, parameters);
        return false;
    }
}

Этот код все еще не совершенен, но он должен дать вам представлениев каком направлении вам следует идти.

Answer 2

Это не ненавязчивая проверка, это очень навязчивая проверка.

Чтобы использовать ненавязчивую проверку, украсьте вашу модель атрибутами, например:

    public class ValidationModel {
    [Required]
    public string FirstName { get; set; }
 
    [Required, StringLength(60)]
    public string LastName { get; set; }
 
    [Range(1, 130)]
    public int Age { get; set; }
}

Используйте помощники MVC для ввода HTML и сообщений проверки:

    @Html.TextBoxFor(x => x.FirstName)                                  
    @Html.ValidationMessageFor(x => x.UserName)

    @Html.TextBoxFor(x => x.LastName)                                   
    @Html.ValidationMessageFor(x => x.LastName)

    @Html.TextBoxFor(x => x.Age)
    @Html.ValidationMessageFor(x => x.Age)

Включите библиотеку JQuery Validate и библиотеку ненавязчивой проверки:

<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript">
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript">
<script src="@Url.Content("~/Scripts/jquery.validate.js")" type="text/javascript">
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.js")" type="text/javascript">

Включить ненавязчивую проверку в web.config:

<appSettings>
  <add key="UnobtrusiveJavaScriptEnabled" value="true" />
</appSettings>

Проверьте элементы в firebug, чтобы убедиться, что к ним добавлены ненавязчивые атрибуты «data-val», например ::

<input data-val="true" data-val-length="The field Name must be a string with a maximum length of 5." data-val-length-max="5" data-val-required="The Name field is required." id="Name" name="Name" type="text" value="" />

И проверка будет работать, JavaScript не требуется, совершенно незаметно.

Дополнительная информация:

http://weblogs.asp.net/mikaelsoderstrom/archive/2010/10/06/unobtrusive-validation-in-asp-net-mvc-3.aspx

http://thepursuitofalife.com/asp-net-mvc-3-unobtrusive-javascript-validation-with-custom-validators/