jquery-form-validator.js: ввод формы проверяется, но сама форма не проходит проверку. Только один вход в форму

Question

Я использую jQuery-Form-Validator, и большинство из них идет нормально.

У меня есть форма, которая содержит только поле электронной почты и кнопку отправки. Поле электронной почты корректно проверяется при размытии, но когда форма отправлена, я получаю сообщение об ошибке, в котором говорится, что форма недействительна (не поле).

Я потерялся.

Вот все биты кода...

<form id="form_email" name="form_email" class="justify-content-center" onsubmit="return false;">
    <div id="email-group" class="form-group">
        <input class="form-control form-control-lg mr-1" type="text" id="email" name="email" placeholder="Email Address" value="" data-validation="email" data-validation-error-msg-container="#email-error-dialog" autocomplete="on" /> 
        <p class="form-control-feedback" id="email-error-dialog"></p>
        <p class="text-muted">We will only share your email address with other companies when you explicitly give us permission.</p>
        <input type="submit" class="btn btn-primary btn-lg" id="email-next" value="Save" />
    </div>
</form>

<script>
    $( "#form_email" ).submit(function( event ) {
        updateRecord('user_inputs', 'fingerprint', fp2_hash, 'email',   $( "email" ).value);
        //alert( "Handler for .submit() called." );
        //event.preventDefault();
    });

    $( "#email" ).on( 'validation', function(evt, valid) {

      // If it's a valid email address...
      if ( valid == true ) {
            // Update style
            if ( $( "#email-group" ).hasClass( "has-danger" ) ) $( "#email-group" ).removeClass( "has-danger" );
            if ( $( "#email" ).hasClass( "form-control-danger" ) ) $( "#email" ).removeClass( "form-control-danger" );

            $( "#email-group" ).addClass( "has-success");
            $( "#email" ).addClass( "form-control-success" );
      } else if ( valid == false) {
            // Update style
            if ( $( "#email-group" ).hasClass( "has-success" ) ) $( "#email-group" ).removeClass( "has-success" ); 
            if ( $( "#email" ).hasClass( "form-control-success" ) ) $( "#email" ).removeClass( "form-control-success" );

            $( "#email-group" ).addClass( "has-danger" );
            $( "#email" ).addClass( "form-control-danger" );
            $( "#email-error-dialog" ).addClass( "has-danger" );
      }  
    });
</script>

Затем вызывается скрипт валидатора, который заканчивается:

<script type="text/javascript">
    $.validate({
        modules : 'html5, toggleDisabled',
        forms : '#leads, #form_email',
        disabledFormFilter : 'form.toggle-disabled',
        showErrorDialogs : false,
        successElementClass : 'has-success',
        errorElementClass : 'has-danger',
        onError : function($form) {
              alert('Validation of form '+$form.attr('id')+' failed!');
        },
        onSuccess : function($form) {
              alert('The form '+$form.attr('id')+' is valid!');
              return true; // Will stop the submission of the form
        },
        onValidate : function($form) {
              return {
                element : $( this),
                message : 'This input has an invalid value for some reason'
        }
    },
    onElementValidate : function(valid, $el, $form, errorMess) {
        console.log('Input ' +$el.attr('name')+ ' is ' + ( valid ? 'VALID':'NOT VALID') );
    },
    validateOnBlur : true, // disable validation when input looses focus
        errorMessagePosition : 'inline', // Default. Instead of top
        scrollToTopOnError : true // Set this property to true on longer forms
    });
</script>

Вы можете посмотреть его вживую, но вы должны пройти тест из трех вопросов, чтобы добраться до него. Ответы: "У меня есть", "101-150 долларов" и "Без тени".

Спасибо за помощь!

Answer 1

Вы, вероятно, должны удалить эту часть:

onValidate : function($form) {
          return {
            element : $( this),
            message : 'This input has an invalid value for some reason'
    }
}

Он всегда сообщит валидатору, что у вас есть недопустимый элемент, когда форма отправляется.