Я использую плагин jQuery Validation и хочу отключить созданный элемент или контейнер для отображения сообщения об ошибке.
В принципе, я хочу, чтобы элемент ввода с ошибкой имел класс ошибок, но НЕ создавал дополнительный элемент, содержащий сообщение об ошибке.
Возможно ли это?
Я только что подумал об обходном пути CSS, но на самом деле он не фиксирует тот факт, что элемент все еще создается?
<style>
label.simpleValidationError {display: none !important; }
</style>
Используйте параметр Validator errorPlacement с пустой функцией:
$("selector").validate({ errorPlacement: function(error, element) {} });
Это фактически помещает сообщения об ошибках в никуда.
Вы можете установить параметр showErrors функции, которая выполняет только выделение элементов:
$("selector").validate({
showErrors: function() {
if (this.settings.highlight) {
for (var i = 0; this.errorList[i]; ++i) {
this.settings.highlight.call(this, this.errorList[i].element,
this.settings.errorClass, this.settings.validClass);
}
}
if (this.settings.unhighlight) {
for (var i = 0, elements = this.validElements(); elements[i]; ++i) {
this.settings.unhighlight.call(this, elements[i],
this.settings.errorClass, this.settings.validClass);
}
}
}
});
Это в значительной степени зависит от внутренних модулей плагина проверки, поэтому, вероятно, это небезопасно. Лучше всего было бы для плагина выставить метод defaultHighlightElements() так же, как для defaultShowErrors(), но это не так (пока).
Вы также можете использовать этот код:
jQuery.validator.messages.required = "";
$("selector").validate();
Я также хотел скрыть сообщения об ошибках и поменять поля input и textarea red, при ошибке.
Вот небольшой пример:
и полностью рабочий код в случае разрыва jsfiddle;)
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title> Demo</title>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.10.1.js'></script>
<script type='text/javascript' src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.15.0/jquery.validate.js"></script>
<style type='text/css'>
.error {
border: 1px solid red;
}
</style>
<script type='text/javascript'>//<![CDATA[
$(window).load(function(){
$( "#email_form" ).validate({
rules: {
email: {
required: true,
email: true
}
}, highlight: function(input) {
$(input).addClass('error');
},
errorPlacement: function(error, element){}
});
});//]]>
</script>
</head>
<body>
<form name="form" id="email_form" method="post" action="#">
<div class="item" style="clear:left;">
<label>E Mail *</label>
<input id="femail" name="email" type="text">
</div>
Type invalid email and press Tab key
</form>
</body>
</html>
У меня тоже была такая же проблема. Мне не нужны сообщения об ошибках, а только основные моменты входных данных формы, которые требуют внимания.
Сообщения уже были пустыми, как <?php $msj='""';?>, но все же создали элементы/контейнеры ошибок после ярлыков.
Чтобы быстро остановить это, я редактировал файл jquery.validate.js, комментируя единственную строку, в которой label.insertAfter(element); указывается строка строки 697 +/-..
Это просто обходной способ noob;), но он сделал это!
Поскольку я использую CSS для стиля label.valid, label.error в jquery validate, эта кнопка очистила все ошибки и левую и данные в полях формы в такте.
<button onclick="$('label.error').css('display', 'none');return false;">Clear Error </button>
Возможно, гораздо проще и семантически предпочтительным решением было бы использовать css
label.error {
position:absolute;
left:20000px;
top:0;
}
input.error {
border:red 1px;
}
Нет необходимости в JS, проще управлять, а у кого-то с помощью программы чтения с экрана действительно будет некоторое указание на то, что они что-то пропустили
У меня был проект, разработанный другой библиотекой проверки, я хотел добавить библиотеку проверки, чтобы использовать ее функции для проверки правильности формы или нет (используемая библиотека проверки не имеет этой функции)
Мое решение было: Я просто добавил библиотеку проверки по своему CDN
и используйте функцию проверки при нажатии:
$(document).on('click','#buttonID',function(){
var form = $( "#formID" );
form.validate();
console.log(form.valid());
});
и попытался скрыть сообщения об ошибках, которые были подняты с помощью проверки jquery, добавив код CSS:
label.error{
display: none!important;
}
Простое решение только с CSS:
label.valid {
display: none;
}
Вы можете добавить onfocus и onkeyup, которые удалили бы сообщение об ошибке.
$("selector").validate({
onkeyup: false,
onfocusout: false
});