Настройка jquery validation?

Question

[yura_89]

Здравствуйте!
Пожалуйста, помогите разобраться с ситуацией.

На своем сайте в почтовых формах реализовал валидацию полей через специальный jquery плагин jquery validation. В установке плагин оказался достаточно простым, проблем с ним не возникло.

Суть плагина заключается в том, что если поле не проходит проверку, то после поля появляется специальный label с классом .error , которому через css я могу задать любые стили.
Если же поле проходит валидацию, то label'у присваивается display:none, а input'у присваивается класс .valid .

Собственно вопрос заключается в следующем: как присвоить класс .valid не input'у, а еще одному label'у ?

заранее спасибо!

Answer 1

[Сергей Горячев]

Встречный вопрос:
Как сварить макароны, если карандаши в тостере становятся зеленого цвета и не забивают гвозди после переноса на балкон?
Показывайте код, если хотите, чтобы Вам объяснили ошибку.

Comments

[yura_89]

Я указал плагин, с которым возникла проблема. Если с плагином не работали - не стоит тратить время своё и отвечать.

[Сергей Горячев]

Юрий Аванесов: Если бы я не работал с ним, я бы не стал писать вообще, так уж привык. Но без конкретики отвечать нереально. Точней реально, но разобраться на примере лучше.

[yura_89]

Sergey: вы пишите "показывайте код, если хотите, чтобы Вам объяснили ошибку". Вы даже не прочитали суть моего вопроса. Никакой ошибки нет, в вопросе я спросил, как "дополнить" плагин, в частности, добавив еще один label.

Answer 2

[mletov]

Сделать, конечно, можно, приблизительно вот так

var form = $( "#myform" );
form.validate();
$( "button" ).click(function() {
  $("input.valid").removeClass("valid");
  $("label.need-class").addClass("valid");
});

Но мне кажется, лучше разобраться, зачем вообще понадобилось менять дефолтное поведение плагина, есть в этом что-то неестественное.

Comments

[yura_89]

Просто сообщение об ошибке имеет свой фон-иконку, размер, отступ и другие стили, с отступами от поля (инпута). У макета поля , пройденные валидацию, имеют схожие стили, но с другой иконкой.

[mletov]

Тогда лучше поиграться с псевдоэлементами after и before и для них нужные стили назначить, такие вещи обычно решаются через css

Answer 3

[Виталий Инчин ☢]

.valid + label{
    color: green;
}

Направление уловили?

Answer 4

[Serdji]

А вы правильно настроили форму. Я сам использовал этот плагин на своем проекте, и он без всяких велосипедов добавляет этот класс. Если форма не прошла валидацию будет

<label id="lastname-error" class="error" for="lastname">Введите не мение 3-х символов</label>

Если прошла

<label id="lastname-error" class="error valid" for="lastname">Готово!</label>

Comments

[yura_89]

Из настроек я поменял только проверяемые поля и ошибки, которые должны показываться. Вроде настроил все верно, но при условии, когда поле проходит валидацию, то label'у присваивается display:none.

[Serdji]

Не смогу ответить точно почему так происходит. Но я сделал так.

В настройках я добавил такую строку

success : function(label) { label.addClass( 'valid' ).text( 'Готово!' )};

А в css

.valid{
color: green;
}