#javascript #jquery #asp.net #forms #validation
#javascript #jquery #asp.net #формы #проверка
Вопрос:
У меня есть ASP.Net Проект MVC, и я использую ненавязчивую проверку jQuery. чтобы добавить проверку, когда элемент теряет фокус, я вызываю
$(document).ready(function () {
// enable validation when an input loses focus.
var settngs = $.data($('form')[0], 'validator').settings;
settngs.onfocusout = function (element) { $(element).valid(); };
});
Это работает в одном проекте, в то время как это создает это исключение в другом проекте, потому что $.data($(‘form’)[0], ‘validator’) возвращает undefined ($.data($(‘form’)[0]) возвращает пустой объект):
Неперехваченная ошибка типа: не удается прочитать свойство ‘settings’ неопределенного
Однако проверка jQuery работает нормально при нажатии кнопки отправки, поэтому все остальное должно быть настроено правильно.
Я загружаю эти скрипты в конце тега body: (функция, перечисленная выше, находится в customvalidations.js поэтому он должен выполняться после применения средства проверки к форме)
<script src="/Staffing/Scripts/jquery-2.1.1.js"></script>
<script src="/Staffing/Scripts/globalize/globalize.js"></script>
<script src="/Staffing/Scripts/globalize/cultures/globalize.culture.de-DE.js"></script>
<script src="/Staffing/Scripts/bootstrap.js"></script>
<script src="/Staffing/Scripts/respond.js"></script>
<script src="/Staffing/Scripts/bootstrap-datepicker.js"></script>
<script src="/Staffing/Scripts/bootstrap-datepicker-globalize.js"></script>
<script src="/Staffing/Scripts/locales/bootstrap-datepicker.de.js"></script>
<script src="/Staffing/Scripts/jquery.unobtrusive-ajax.js"></script>
<script src="/Staffing/Scripts/jquery.validate.js"></script>
<script src="/Staffing/Scripts/jquery.validate.globalize.js"></script>
<script src="/Staffing/Scripts/jquery.validate.unobtrusive.js"></script>
<script src="/Staffing/Scripts/localization/messages_de.js"></script>
<script src="/Staffing/Scripts/customvalidations.js"></script>
<script src="/Staffing/Scripts/uiadditions.js"></script>
<script src="/Staffing/Scripts/default.js"></script>
Решение:
Это код, который работает:
$(document).ready(function () {
// enable validation when an input loses focus.
var allForms = $('form');
$.each(allForms, function (key, value) {
var val = $.data(value, 'validator');
if (val != undefined) {
var settngs = val.settings;
settngs.onfocusout = function (element) { $(element).valid(); };
}});
});
Проблема заключалась в том, что новый плагин проверки проверяет, присутствуют ли какие-либо элементы, которые должны быть проверены, и у меня было 2 формы на одной странице, причем в первой форме не было никаких проверенных элементов ввода.
Ответ №1:
Я только что обновился до Microsoft.jQuery.Ненавязчивый.Пакет проверки.3.2.0. Я столкнулся с той же проблемой. Возможно ли, что вы также обновились до той же версии?
Если это так, я мог бы предложить свои два цента :). После небольшой отладки я заметил, что в jquery.validate.unobtrusive.js:
Предыдущая версия:
var $forms = $(selector)
.parents("form")
.andSelf()
.add($(selector).find("form"))
.filter("form");
Новая версия:
$forms = $selector.parents()
.addBack()
.filter("form")
.add($selector.find("form"))
.has("[data-val=true]"); // key point!
Ключ, похоже, такой: the has("[data-val=true]")
. То есть, если ваша форма не имеет потомков (например, элемента ввода) с этим значением атрибута, она не будет проанализирована помощником по проверке, и никакие данные ‘validator’ не будут назначены этому элементу формы. Затем вы получите эту ошибку ‘undefined’, если попытаетесь получить доступ к средству проверки этой формы на более позднем этапе.
В моем случае формы, для которых это происходило, фактически не использовали никакой проверки, следовательно, у них не было этого атрибута. Затем я смог изменить свою пользовательскую логику проверки, чтобы сначала проверить, существует ли средство проверки, прежде чем изменять настройки средства проверки.
Надеюсь, это поможет.
Комментарии:
1. Это было причиной. Смотрите мой отредактированный вопрос для рабочего кода.
2. Просто вау. Мы используем ненавязчивый интерфейс razor для динамических элементов управления: буквально установив только контейнер div где-нибудь под формой, восстановили всю нашу нарушенную проверку. Это было трудно найти, и этот ответ был очень полезен. Спасибо.
3. Да, определенно полезно, большинство моих полей были доступны только для чтения, а два, которые не были, не имели никаких атрибутов data-val. Трудно найти, заняло около часа.
4. Чтобы принудительно создать
validator
данные, я просто добавил фиктивный ввод в свой,<form>
вот так:<input type="hidden" data-val="true" data-val-required="The Useless field is required." id="Useless" name="Useless" value="Useless" />
. Спасибо за этот ответ, действительно было очень сложно понять, что происходит.
Ответ №2:
Это может произойти и с вами, вы не вызывали validate() в своей форме как таковой:
$("#your_form").validate();
В моем случае у меня не было формы с идентификатором «your_form» на моей странице, что вызывало эту ошибку при попытке добавить правила.
Комментарии:
1. У меня сработало при динамическом добавлении формы через ajax
Ответ №3:
Похоже, что в ваших проектах используются разные типы validadion (один из них использует ненавязчивый, а второй — по умолчанию).
Пожалуйста, проверьте, используете ли вы следующие настройки в web.config обоих проектов.:
<configuration>
<appSettings>
<add key="ClientValidationEnabled" value="true"/>
<add key="UnobtrusiveJavaScriptEnabled" value="true"/>
</appSettings>
</configuration>
Также вы пытаетесь работать с первой формой в вашем документе.
В случае, когда форм нет — вы получите сообщение об ошибке.
В случае, когда существует более одной формы — только первая форма будет использовать focusout для проверки.
Итак, вы должны сделать то же самое для каждой формы:
$(document).ready(function () {
var $forms = $('form');
$.each($forms, function (key, value) {
// enable validation when an input loses focus.
var settings = $.data(value, 'validator').settings;
settings.onfocusout = function (element) { $(element).valid(); };
});
});
Ответ №4:
Выполнение этого $.validator.unobtrusive.parse($("#base-modal form"));
решило мою проблему
Ответ №5:
Сначала проверьте количество форм, я думаю, вы используете неправильную форму.
$(document).ready(function () {
// enable validation when an input loses focus.
if($('form').length > 0) {
// $('form')[0] is it proper form?
var settngs = $.data($('form')[0], 'validator').settings;
settngs.onfocusout = function (element) { $(element).valid(); };
}
});
Комментарии:
1. $(‘form’).length > 0 возвращает true (на странице есть форма)