Форма Bootstrap 3 с использованием меток обертывания ввода-группы-аддонов с помощью Jquery Validate

Использование Bootstrap 3 с формой-горизонталью с использованием форм-групп и тегов входных групп с помощью Jquery-Validate. Когда Jquery.Validate запускается для ошибок, он добавляет управление ошибкой метки во входной группе.

Проблема заключается в том, что add-group-addon обертывает следующую строку под полем формы, когда элемент управления ошибкой метки добавляется Jquery Validate. Jquery Validate error wrapping input-group-addon

VIEW: http://www.bootply.com/114554

Как мне получить ошибку метки, находящуюся под элементом управления формой, и не обернуть добавление группы входных данных в следующую строку?

Да, я знаю об этом решении - отлично работает, но по-прежнему не выстраивает метку ошибки для формы-горизонтальной: Bootstrap 3 с плагином проверки jQuery

Ответы

Ответ 1

Решил это по-другому: http://www.bootply.com/2liEuyqrAb

Придется перемещать ярлык вне группы ввода. После этого ожидаемое поведение: метка формы слева, поле вправо и ошибка ниже поля.

Ответ 2

Самый простой способ решить вашу проблему - поставить метку ошибки в свойство абсолютной позиции в css. В вашем примере вот результат:

.text-danger {
    color: #a94442;
    position: absolute;
    width: 100%;
    line-height: 34px;
    margin-left: 8px;
}