如何提交表单如果没有错误？

Question

如何验证后提交表单是否没有错误？我试过返回false，但表单没有提交。什么是最好的解决方案呢？

这里是我的代码：

jQuery(function($) { 
    $('[data-numeric]').payment('restrictNumeric'); 
    $('.cc-number').payment('formatCardNumber'); 
    $('.cc-exp').payment('formatCardExpiry'); 
    $('.cc-cvc').payment('formatCardCVC'); 

    $.fn.toggleInputError = function(erred) { 
     this.parent('.form-group').toggleClass('has-error', erred); 
     return this; 
    }; 

    $('#payment-form').submit(function(e) { 
     e.preventDefault(); 

     var cardType = $.payment.cardType($('.cc-number').val()); 
     $('.cc-number').toggleInputError(!$.payment.validateCardNumber($('.cc-number').val())); 
     $('.cc-exp').toggleInputError(!$.payment.validateCardExpiry($('.cc-exp').payment('cardExpiryVal'))); 
     $('.cc-cvc').toggleInputError(!$.payment.validateCardCVC($('.cc-cvc').val(), cardType)); 
     $('.cc-brand').text(cardType); 

     if (!$('.form-group').hasClass('has-error')) { 
      return false; 
     } 
    }); 
}); 

Answer 1

您的形式永远不会因preventDefault()调用，它始终是逻辑流程的一部分提交。您应该将其置于if条件检查中以查找错误类别。试试这个：

$('#payment-form').submit(function(e) { 
    var cardType = $.payment.cardType($('.cc-number').val()); 
    $('.cc-number').toggleInputError(!$.payment.validateCardNumber($('.cc-number').val())); 
    $('.cc-exp').toggleInputError(!$.payment.validateCardExpiry($('.cc-exp').payment('cardExpiryVal'))); 
    $('.cc-cvc').toggleInputError(!$.payment.validateCardCVC($('.cc-cvc').val(), cardType)); 
    $('.cc-brand').text(cardType); 

    if ($('.form-group').hasClass('has-error')) { 
     e.preventDefault(); 
    } 
});