Как сделать форму контакты таким образом, как на фото?

Question

[Абай Тажигалиев]

Форма контакты сделано, как оформить при выводе ошибок?

Answer 1

[Максим Тимофеев]

C помощью js.
Заранее подготовить css стили для ошибок.
Потом добавлять контейнер с ошибкой и убирать при прохождении валидации. Обрабатывать данные можно в браузере или отправлять ajax на сервер.
Есть готовые решения. Ищите по запросу "валидация форм".

Comments

[Абай Тажигалиев]

Спасибо!

Answer 2

[look2009]

Либо валидация в самой странице, что не есть гуд, либо аякс после валидации скриптом, а там либо сьюцесс либо еррор в зввисимости от еррора вывод.

Comments

[Абай Тажигалиев]

<?=lang('send_messages');?>

[Dark Hole]

Абай Тажигалиев: вас валидация интересует или вывод ошибок? Вывод - контейнер с overflow: hidden; и jQuery для анимации

[Абай Тажигалиев]

Dark Hole: Использую плагин jQuery Validation, там есть класс по умолчанию error, как сделать чтобы он выводился внизу каждого input блока.

[German Jet]

сьюцесс?? (success) :)

[Абай Тажигалиев]

German Jet: Например в в поле textarea ширина 100%, а в поле имя и email, не правильно выводится ошибки, наезжает друг на друга

[Максим Тимофеев]

Абай Тажигалиев: css править нужно

[Абай Тажигалиев]

Максим Тимофеев: Спасибо большое, все сделал как вы сказали, создал класс error-box контейнер для ошибок. Теперь все красиво выводится.

[Dark Hole]

Абай Тажигалиев: стандартное решение, я почему-то сразу решил, что у вас все отдельным контэйнером

[Абай Тажигалиев]

Dark Hole: Спасибо вам тоже, при правильном заполнения убрал ошибки через display:none;