2015-08-07 4 views
-1

У меня возникают трудности с получением моей формы для работы. Я частично работаю. Поля, которые требуются, появляются красным цветом, когда они не заполняются. Проблема в том, что они остаются красными, даже когда они заполняются. Мне нужно добавить обработчик размытия, но я не знаю, где. Вот код. В идеале мне нравится, когда после заполнения страницы страница переходит к следующему полю ввода, но я думаю, что это может быть слишком сложно. Вот кодФорма подтверждения продукта jquery

initValidation: function() { 

     var showError = function (message) { 
      $('<div>').html($('#templateErrorMessage').render({ 
       message: message 
      })).children().prependTo(document.body); 
     }; 

     $(document.body).on('submit', 'form', function (e) { 
      var form = $(this); 
      var inputs = form.find(':input:visible, .custom-select:visible select').filter('.required-entry'); 
      var isValid = true; 

      inputs.each(function (i, input) { 
       input = $(input); 

       var value = $.trim(input.val()); 

       input.closest('.form-row').toggleClass('has-error', !value); 

      /// $(input).blur(); 

       input.blur(function() { 
        if (isValid) 
         prompt.removeClass('has-error', !value); 
       }); 

       isValid = isValid && !!value; 
      }); 

      if (!isValid) { 
       e.preventDefault(); 
       showError('Please fill in required fields!'); 
       scrollTo(0, 0); 
      } 
     }); 
    } 
+0

Это не проблема Sass, только вывешиваем скомпилированный CSS. – cimmanon

+0

Я настоятельно рекомендую использовать jQuery Validate вместо того, чтобы кататься самостоятельно. Поведение, которое вы ищете, и многое другое, было решено давно. Cheers –

+0

Эй, Джим, спасибо за совет. Является ли альтернатива (с использованием размытия) слишком трудной для достижения? Я действительно не уверен в себе, поэтому любые советы очень ценятся. –

ответ

0

Это, как я ее решил

initValidation: function() { 

     var showError = function (message) { 
      $('<div>').html($('#templateErrorMessage').render({ 
       message: message 
      })).children().prependTo(document.body); 
     }; 

     $(document.body).on('submit', 'form', function (e) { 
      var form = $(this); 
      var inputs = form.find(':input:visible, .custom-select:visible select').filter('.required-entry'); 
      var isValid = true; 

      inputs.each(function (i, input) { 
       input = $(input); 

       var value = $.trim(input.val()); 

       input.closest('.form-row').toggleClass('has-error', !value); 

       input.one('focus change', function() { 
        input.closest('.form-row').removeClass('has-error'); 
       }); 

       isValid = isValid && !!value; 
      }); 

      if (!isValid) { 
       e.preventDefault(); 
       showError('Please fill in required fields!'); 
       scrollTo(0, 0); 
      } 
     }); 
    } 
Смежные вопросы