Спасибо за ответ, но не то совсем.
Есть input, с подсказкой, что нужно в него ввести. Пока пользователь не ввел что-то свое - отправлять нельзя.
Смотрим на пример ваш.
Сразуже - Клик по "Отравить" - получаем "ajax" - типо данные введены верно, отправляем запрос. Это уже ошибка. данные не введенны пользователем, только клик, а запрос уже пошел.
01 <!DOCTYPE HTML>
02 <html>
03 <head>
04 <meta charset="utf-8">
05 <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
06 </head>
07 <body>
08 <div class="box">
09 <input value="123">
10 <button>Отправить</button>
11 </div>
12
13 <div class="box">
14 <input value="456">
15 <button>Отправить</button>
16 </div>
17
18 <div class="box">
19 <input value="789">
20 <button>Отправить</button>
21 </div>
22
23 <script>
24 $(function() {
25
26 $('.box button').on('click', function() {
27 var $parent = $(this).parent();
28 if ($(this).prev().val() !== '') {
29 $parent.find('span.errspan').remove();
30 alert('ajax');
31 } else {
32 if (!$parent.find('span.errspan').length) {
33 $parent.append( $('<span class="errspan">error</span>').css('color', 'red') );
34 }
35 }
36 });
37
38 });
39 </script>
40
41 </body>
42 </html>
Как тут кнопочку "Просмотреть прикрутить?"
Уточняю проблему:
Немного скорректировал html код. Считаем, что html больше добавлять нельзя.
Если ничего не ввели - но кликнули - сообщение об ошибке в своем диве выводим.
Если что-то ввели , или один символ убрали (123 != 12 ) отправляем AJAX
