Не могу понять, как применить jquery.unobstrusive к jquery.ui.datepickers, чтобы требовать поля даты

Question

Используя MVC3 Razor, у меня есть частичное представление с некоторым текстом, двумя текстовыми полями (StartDate & EndDate), кнопкой отмены и кнопкой поиска.

Когда недопустимые даты вводятся в текстовые поля StartDate и EndDate,текстовые поля выделяются красным с ненавязчивым оформлением, используемым средством выбора даты?

Я не могу понять, как требовать эти поля, и выделяю их красным, поскольку ввод недействительных данных делает.

Вот мой код

<script type="text/javascript">
$(document).ready(function () {
    $('.date').datepicker({ dateFormat: "mm/dd/yy" });

    $("#printnoteform").validate({
        rules: {
            startdate: {
                required: true
            },
            enddate: {
                required: true
            }
        },
        messages: {
            startdate: {
                required: "Required"
            },
            enddate: {
                reqquierd: "Required 2"
            }
        }
    });
});
</script>

Форма ...

@using (Html.BeginForm("PrintNotes", "Note", FormMethod.Post, new { id = "printnoteform", name = "printnoteform" }))
{
    ......

HTML для StartDate & EndDate

<input type="text" id="startdate" name="startdate" class="date" />
<input type="text" id="enddate" name="enddate" class="date" />

У меня нет ошибок браузера, StartDate и EndDate не являются частью моделии я не хочу делать один, если мне не нужно.Web.config настроен правильно.

Чего мне не хватает?

Answer 1

У вас есть две взаимоисключающие возможности :

1. Использование ненавязчивого jquery
2. Вручную подключите правила проверки формы

Если вы хотите использовать ненавязчивый jquery, вам не следует вручную добавлять в форму какие-либо правила .validate (как вы это сделали).Это делается автоматически с помощью ненавязчивого скрипта jquery.Конечно, чтобы это можно было сделать, ваши поля ввода должны быть украшены HTML5-атрибутами data- *, чтобы указывать правила и сообщения для использования.Например:

<input class="text-box single-line" data-val="true" data-val-required="The startdate field is required." id="startdate" name="startdate" type="text" value="" />
<input class="text-box single-line" data-val="true" data-val-required="The enddate field is required." id="enddate" name="enddate" type="text" value="" />

Обычно это выходные данные, которые генерируют стандартные помощники HTML, такие как EditorFor, когда вы используете модель представления и привязываете ее свойства.Они используют аннотации данных в вашей модели представления, чтобы вывести правила валидации и транспонировать их как атрибуты data- *.

Вторая возможность - это вручную подключить правила валидации.В этом случае вы должны удалить все следы ненавязчивого скрипта jquery, поскольку он будет конфликтовать с вашими правилами .validate в форме.В этом случае вам решать определить правила и сообщения.