MVC3 простая проверка формы - PullRequest
4 голосов
/ 07 декабря 2011

Я новичок в MVC3 и впервые проверю форму.Я видел некоторые примеры проверки с использованием jQuery и Model.IsValid, но я не знаю, является ли это моим случаем.

Я использую @ Html.TextBox и @ Html.ValidationMessage, я вижу, что мне нужночтобы поместить 2 строки jQuery в мой документ для проверки:

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

И я увидел, что многие люди используют проверку только с jQuery, но я не мог понять, как она на самом деле работает.Итак, не могли бы вы дать мне пример кода проверки для Razor View с jQuery (при необходимости) и для Controller?Поскольку я не использую TextBoxFor, я считаю, что я не могу использовать проверку только с Datannotations в классе Model.

Форма, которую мне нужно проверить:

@Html.TextBox("user", "User:")
@Html.TextBox("email", "Email:") <!-- with validation of email string -->
@Html.Password("password")
@Html.Password("passwordConfirm") <!-- with validation if 2 password strings match -->

1 Ответ

17 голосов
/ 07 декабря 2011

Сценарий jquery.validate.unobtrusive.min.js работает в сочетании с аннотациями данных, размещенными в свойствах вашей модели. Эти атрибуты валидатора затем транслируются помощниками HTML для передачи атрибутов данных data5 * HTML5, которые используются сценарием. Если у вас нет модели, украшенной атрибутами проверки, вы не можете использовать этот сценарий.

Это значит, что у вас все еще может быть модель с атрибутами валидации, и вы все равно будете использовать TextBox вместо TextBoxFor. Это было бы совершенно глупо и бессмысленно, но вы можете сделать это:

public class MyViewModel
{
    [Required]
    public string MyProperty { get; set; }
}

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

@model MyViewModel
@using (Html.BeginForm())
{
    @Html.TextBox("MyProperty")
}

Если у вас нет модели представления (не знаю, почему у вас не будет модели представления, поскольку это идет вразрез с хорошими практиками, о которых я проповедую), вы можете вручную подключить проверку. В этом случае вы просто удаляете скрипт jquery.validate.unobtrusive и используете базовый плагин проверки jquery:

$(function() {
    $('#id_of_your_form').validate({
        rules: {
            MyProperty: {
                required: true
            }
        },
        messages: {
            MyProperty: {
                required: 'Please enter a value for MyProperty'
            }
        }
    });
});

Очевидно, что рекомендуемое решение - использовать модель представления и строго типизированные помощники:

public class RegisterViewModel
{
    public string User { get; set; }

    [DataType(DataType.EmailAddress)]
    [Email] // taken from Scott Gu's blog post: http://weblogs.asp.net/scottgu/archive/2010/01/15/asp-net-mvc-2-model-validation.aspx
    public string Email { get; set; }

    public string Password { get; set; }

    [Compare("Password")]
    public string PasswordConfirm { get; set; }
}

а затем, по вашему мнению:

@model RegisterViewModel
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
@using (Html.BeginForm())
{
    <div>
        @Html.LabelFor(x => x.User)
        @Html.EditorFor(x => x.User)
        @Html.ValidationMessageFor(x => x.User)
    </div>
    <div>
        @Html.LabelFor(x => x.Email)
        @Html.EditorFor(x => x.Email)
        @Html.ValidationMessageFor(x => x.Email)
    </div>
    <div>
        @Html.LabelFor(x => x.Password)
        @Html.PasswordFor(x => x.Password)
        @Html.ValidationMessageFor(x => x.Password)
    </div>
    <div>
        @Html.LabelFor(x => x.PasswordConfirm)
        @Html.PasswordFor(x => x.PasswordConfirm)
        @Html.ValidationMessageFor(x => x.PasswordConfirm)
    </div>
    <button type="submit">Register</button>
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...