Форма регистрации

Рейтинг: 0Ответов: 1Опубликовано: 04.10.2014

Добрый день! Подскажите, пожалуйста, как можно подсветить инпут, когда поле будет пустым (это класс reg-cross) и также вывести сообщение "Такой email уже есть", когда такой, допустим, email уже существует (класс тот же, reg-cross). Сделал только так: при обоих неудачных случаях выходит только крестик, хотелось бы под полем вывести сообщение, когда email такой же, а при пустом поле еще и подсветить его красным. Заранее большое спасибо)

<form method="post" action="#" class="registr">       
       <p>
          <label for="email_reg">Email:</label>
          <input class="access" type="text" data-field="email" name="email_reg" id="email_reg" />
          <span></span>
      </p>
       <p>
          <label for="login_reg">Логин:</label>
          <input class="access" type="text" data-field="login" name="login_reg" id="login_reg" />
          <span></span>
       </p>     
        <p class="submit2">
            <input type="submit" value="Зарегистрироваться" name="reg" />
        </p>  
</form>

$(".access").change(function(){
                var $this = $(this);
                var val = $.trim($this.val());
                var dataField = $this.attr('data-field');
                var span = $this.next();

                if(val == ''){
                    span.removeClass().addClass('reg-cross');
                }else{
                    span.removeClass().addClass('reg-loader');
                    $.ajax({
                        url: '?view=reg',
                        type: 'POST',
                        data: {val: val, dataField: dataField},
                        success: function(res){
                            if(res == 'no'){
                                span.removeClass().addClass('reg-cross');
                            }else{
                                span.removeClass().addClass('reg-check');
                            }
                        }
                    });
                }
            });

Ответы

▲ 1
if( ! dataField.email) {
    $('#email_reg').addClass("border");
}

<style>
    .border { border: 3px solid red }
</style>

Вам нужно сделать statusCode и туда ошибки скидывать.

$.ajax({
   url: '?view=reg',
   type: 'POST',
   data: {val: val, dataField: dataField},
   success: function(res){
      if(res == 'no'){
         span.removeClass().addClass('reg-cross');
      }else{
         span.removeClass().addClass('reg-check');
      }
   },
   statusCode: {
      200: function(data) {
          // Если все окей
      },
      403: function(jqXHR) {
         // Если ошибка отдаем заголовок 403 и принимаем ошибку
         // С сервера отдаем json к примеру, если мыло такое уже есть то делаем афтер
         if(Если эта ошибка связанная с email) {
             $('#email_reg').after("Такой email уже есть"); // Это чисто для примера
         }
      }
   }
});