Вам нужно использовать пользовательское размещение элемента ошибки (это будет идти внутрь .validate()
), например:
errorElement: "div",
errorPlacement: function(error, element) {
element.before(error);
}
Это вставит div, содержащий сообщение об ошибке, прямо перед элементом формы, который генерируетошибка.Изменяя 3-ю строку в данном примере, вы можете перемещать этот элемент куда хотите.Например, основываясь на вашем коде, чтобы полностью переместить его за пределы таблицы, вы должны использовать:
errorElement: "div",
errorPlacement: function(error, element) {
element.parent().parent().parent().before(error);
}
... и это поместит его прямо перед всей формой.Конечно, было бы намного элегантнее просто указать область ошибки вне формы ...
<div id="error_goes_here"></div>
<form ...
... и затем поместить ошибку там:
errorElement: "div",
errorPlacement: function(error, element) {
$("#error_goes_here").html(error);
}
В зависимостина каком пути вы решите пойти, вам может даже не понадобиться использовать errorElement
, а просто errorPlacement
.Выбранный ответ на этот вопрос также должен дать вам еще больше информации о том, как его использовать.
Надеюсь, это поможет!
РЕДАКТИРОВАТЬ:
Чтобы расположить элемент ошибки справа, добавьте код размещения ошибки внутри .validate()
:
$("#commentForm2").validate({
errorElement: "div",
errorPlacement: function(error, element) {
element.after(error);
}
});
Созданному элементу ошибки автоматически присваивается класс с именем .error
,так что, если нужно, вы можете стилизовать с помощью CSS:
div.error {
// your CSS
}