размещение ошибок jquery

Question

У меня есть форма JQuery. проверки правильности работают, но я хотел бы, чтобы ошибка была помещена правильно. сейчас он отображается в IE 7 как:

альтернативный текст http://img412.imageshack.us/img412/1810/errorhma.jpg

но я бы хотел отобразить его как:

альтернативный текст http://img520.imageshack.us/img520/7089/error1ace.jpg

это код css:

div.error { display:none; }
           <%-- input { border: 1px solid black; }--%>
            input:focus { border: 1px dotted black; }
            input.error { border: 2px solid red; }
            label.error { color: white; font-size:16px; font-family:Nyala; background-color: red }
            label.valid { color: green; }

Answer 1

try label.error {display: block;}

Answer 2

Вы можете контролировать размещение сообщения об ошибке с помощью errorPlacement. Значением по умолчанию является «error.insertAfter (element)». Вы можете использовать один из них, например:

errorPlacement: function(error, element) {
    error.insertBefore( element );
    //error.appendTo( element.parent().next() );
    //error.appendTo(label.insertAfter( element ));
    //error.insertAfter(element.sibling(a));
}

или даже поставить здесь какое-то условие и использовать другие выражения:

errorPlacement: function(error, element) {
    if ( element.is(".something") ) {
        element.nextAll('div').html(error);
    } else {
        error.insertAfter( element );
    }
}

Надеюсь, это поможет

Answer 3

Есть несколько проблем, во-первых, цвет ошибки отображается как окружение элемента input. Поэтому вам нужно использовать div ошибки, чтобы содержать элемент input, или просто изменить цвет контейнера для элемента формы. Я голосую за изменение цвета контейнера.

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

div.error {
  clear: both;
}

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

http://jsbin.com/amaxa