Проверка на стороне клиента MVC 4 не работает

Ответ 1

У меня была та же проблема. Похоже, что ненавязчивые скрипты проверки не были загружены (см. Скриншот в конце). Я исправил его, добавив в конце _Layout.cshtml

 @Scripts.Render("~/bundles/jqueryval")

Конечный результат:

   @Scripts.Render("~/bundles/jquery")
   @Scripts.Render("~/bundles/jqueryval")
   @RenderSection("scripts", required: false)

За исключением моих стандартных стандартных представлений CRUD все шаблоны проекта Visual Studio по умолчанию.

Загруженные скрипты после устранения проблемы:

Ответ 2

Обязательно добавьте эту команду в конце каждого вида, где вы хотите, чтобы проверки были активными.

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

Ответ 3

В приложении Global.asax.cs, Application_Start() добавьте:

DataAnnotationsModelValidatorProvider.RegisterAdapter(typeof(MyRequiredAttribute), typeof(RequiredAttributeAdapter));

Ответ 4

Возможно, вы уже решили это, но мне повезло, изменив порядок элемента jqueryval в BundleConfig с помощью App_Start. Валидация на стороне клиента не будет работать даже на свежем доступном интернет-решении MVC 4. Поэтому я изменил значение по умолчанию:

            bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                    "~/Scripts/jquery.unobtrusive*",
                    "~/Scripts/jquery.validate*"));

to

        bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                    "~/Scripts/jquery.validate*",
                    "~/Scripts/jquery.unobtrusive*"));

и теперь моя проверка на стороне клиента работает. Вы просто хотите убедиться, что файл ненавязчивый находится в конце (поэтому он не навязчив, hah:)

Ответ 5

Я, наконец, решил эту проблему, включив необходимые скрипты непосредственно в мой .cshtml файл в следующем порядке:

<script src="/Scripts/jquery.unobtrusive-ajax.js"></script>
<script src="/Scripts/jquery.validate.js"></script>
<script src="/Scripts/jquery.validate.unobtrusive.js"></script>

Это немного не по теме, но меня постоянно поражает то, как часто это происходит в веб-программировании, т.е. все кажется на месте, но некоторые неясные настройки оказываются необходимыми для того, чтобы все наладилось. Надуманный, хлипкий, хлипкий.

Ответ 6

На вашем вводе нет атрибутов проверки данных. Убедитесь, что вы сгенерировали его с помощью помощника на стороне сервера, такого как Html.TextBoxFor, и что он находится внутри формы:

@using (Html.BeginForm())
{
    ...
    @Html.TextBoxFor(x => x.AgreementNumber)
}

Также я не знаю, что такое jquery.validate.inline.js script, но если он каким-то образом зависит от плагина jquery.validate.js, убедитесь, что он указан после него.

Во всех случаях посмотрите на свою консоль javascript в браузере для возможных ошибок или отсутствующих сценариев.

Ответ 7

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

$.validator.unobtrusive.parse('your main element on layout');

чтобы зарегистрировать все атрибуты проверки. Вы можете вызвать этот метод (например): $(document).ajaxSuccess() or $(document).ready(), чтобы зарегистрировать их все, и ваша проверка может быть успешно выполнена, а не регистрация всех js файлов в файлах cshtml.

Ответ 8

Причина, по которой атрибуты validation data- * не отображаются в отображаемом html для вашего ввода, может заключаться в отсутствии контекста формы. FormContext создается автоматически при создании формы с помощью @using(Html.BeginForm(...)) { ... }.

Если вы используете обычный тэг html для своей формы, вы не получите проверку на стороне клиента.

Ответ 9

У меня возникла проблема с валидацией, сообщения формы затем проверяются,

Это не работает с jquery cdn

    <script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.js"></script>
    <script src="~/Scripts/jquery.validate.min.js"></script>
    <script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>

Это работает без jquery cdn

<script src="~/Scripts/jquery-1.7.1.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>

Надежда помогает кому-то.

Ответ 10

Для меня это было много поиска. В конце концов я решил использовать NuGet вместо загрузки файлов. Я удалил все задействованные скрипты и сценарии и получил следующие пакеты (последние версии на данный момент)

• jQuery (3.1.1)
• Проверка jQuery (1.15.1)
• Microsoft jQuery Ubobtrusive Ajax (3.2.3)
• Microsoft jQuery Ненавязчивая проверка (3.2.3)

Затем я добавил эти пакеты в файл BundleConfig:

bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                "~/Scripts/jquery-{version}.js"));

bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                "~/Scripts/jquery.validate.js",
                "~/Scripts/jquery.validate.unobtrusive.js",
                "~/Scripts/jquery.unobtrusive-ajax.js"));

Я добавил эту ссылку в _Layout.cshtml:

@Scripts.Render("~/bundles/jquery")

И я добавил эту ссылку к любому виду, в котором я нуждался в проверке:

@Scripts.Render("~/bundles/jqueryval")

Теперь все сработало.

Не забывайте об этом (многие забывают о них):

• Теги формы (@using (Html.BeginForm()))
• Резюме проверки (@Html.ValidationSummary())
• Сообщение о валидации на вашем входе (пример: @Html.ValidationMessageFor(model = > model.StartDate))
• Конфигурация()
• Порядок файлов, добавленных в комплект (как указано выше)

Ответ 11

<script src="/Scripts/jquery.unobtrusive-ajax.js"></script>
<script src="/Scripts/jquery.validate.js"></script>
<script src="/Scripts/jquery.validate.unobtrusive.js"></script>

Этот код работал у меня.

Ответ 12

В моем случае работала сама проверка (я мог проверить элемент и получить правильное логическое значение), но визуального вывода не было.

Моя ошибка заключалась в том, что я забыл эту строку  @Html.ValidationMessageFor(m = > ...)

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

Ответ 13

в приведенной ниже строке показано, что вы не установили атрибут DataAttribute, как это требуется в окне соглашения

<input id="AgreementNumber" name="AgreementNumber" size="30" type="text" value="387893" />

вам нужно

[Required]
public String AgreementNumber{get;set;}

Ответ 14

Использование:

@Html.EditorFor

Вместо:

@Html.TextBoxFor

Ответ 15

Я создал этот html <form action="/StudentInfo/Edit/2" method="post" novalidate="novalidate">, где novalidate="novalidate" предотвращал выполнение jQuery на стороне клиента, когда я удалил novalidate="novalidate", jQuery на стороне клиента был включен и выглядел работоспособным.

Ответ 16

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

И мне нужно было добавить

<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>

В частичный вид, даже если он уже присутствует в представлении _Layout.

Литература:

• Аннотации данных/Валидация не работает для частичных представлений

Ответ 17

Моя проблема была в web.config: UnobtrusiveJavaScriptEnabled был отключен

<appSettings>

<add key="ClientValidationEnabled" value="true"/>

<add key="UnobtrusiveJavaScriptEnabled" value="false"/>

</appSettings>

Я изменился на и теперь работает:

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

Ответ 18

В моем случае я добавил, и id равен имени, автоматически сгенерированному для VS в HTML, и в коде я добавил строку для этого случая.

$(function () {
            $.validator.addMethod('latinos', function (value, element) {
                return this.optional(element) || /^[a-záéóóúàèìòùäëïöüñ\s]+$/i.test(value);
            });

            $("#btn").on("click", function () {
                //alert("aa");
                $("#formulario").validate({                    
                    rules:
                    {
                        email: { required: true, email: true, minlength: 8, maxlength: 80 },
                        digitos: { required: true, digits: true, minlength: 2, maxlength: 100 },
                        nombres: { required: true, latinos: true, minlength: 3, maxlength: 50 },
                        NombresUsuario: { required: true, latinos: true, minlength: 3, maxlength: 50 }
                    },
                    messages:
                    {
                        email: {
                            required: 'El campo es requerido', email: 'El formato de email es incorrecto',
                            minlength: 'El mínimo permitido es 8 caracteres', maxlength: 'El máximo permitido son 80 caracteres'
                        },
                        digitos: {
                            required: 'El campo es requerido', digits: 'Sólo se aceptan dígitos',
                            minlength: 'El mínimo permitido es 2 caracteres', maxlength: 'El máximo permitido son 10 caracteres'
                        },
                        nombres: {
                            required: 'El campo es requerido', latinos: 'Sólo se aceptan letras',
                            minlength: 'El mínimo permitido es 3 caracteres', maxlength: 'El máximo permitido son 50 caracteres'
                        },
                        NombresUsuario: {
                            required: 'El campo es requerido', latinos: 'Sólo se aceptan letras',
                            minlength: 'El mínimo permitido es 3 caracteres', maxlength: 'El máximo permitido son 50 caracteres'
                        }
                    }
                });
            });

<tr>@*<div class="form-group">     htmlAttributes: new { @class = "control-label col-md-2" }      , @class = "form-control" }*@
                <td>@Html.LabelFor(model => model.NombresUsuario )</td>

                        @*<div class="col-md-10">*@
                <td>
                    @Html.EditorFor(model => model.NombresUsuario, new { htmlAttributes = new { id = "NombresUsuario" } })
                    @Html.ValidationMessageFor(model => model.NombresUsuario, "", new { @class = "text-danger" })
                </td>

Ответ 19

Убедитесь, что вы используете Attributes (например, RequiredAttribute), которые находятся в пространстве имен System.ComponentModel.DataAnnotations

Ответ 20

  @section Scripts
 {
<script src="../Scripts/jquery.validate-vsdoc.js"></script>
<script src="../Scripts/jquery.validate.js"></script>
<script src="../Scripts/jquery.validate.min.js"></script>
<script src="../Scripts/jquery.validate.unobtrusive.js"></script>
<script src="../Scripts/jquery.validate.unobtrusive.min.js"></script>
}