0

我实现了一个自定义验证功能,它可以正确验证,但问题是即使该字段无效,我也可以成功提交表单。

这是我的代码:

$("#applicant-email").change(function() {

  var restURL= "http://apilayer.net/api/check?access_key=<key>&email="+$("#applicant-email").val()+"&smtp=1&format=1";
  $.ajax({
    type : 'GET',
    url :restURL,
    dataType :'json',
    success : renderList,
  });
  return false;
});



function renderList(data) {
  if ((data.format_valid == true) && (data.smtp_check == true) ) {
    console.log("Email address is valid");
    $("#applicant-email").removeClass("email-invalid");
    $("#applicant-email").addClass("email-valid");
  }
  else {
    console.log("Email address is not valid");
    $("#applicant-email").removeClass("email-valid");
    $("#applicant-email").addClass("email-invalid");

  }
}


和自定义验证器功能:


$('#myForm').validator({
  custom: {
    emailexist: function ($el) {
      if($('#'+$el.attr('id')).hasClass('email-invalid')){
        console.log("it is invalid")
        return true;
      }
      else {
        console.log("it is valid");
        return false;
      }
    }


  },
  errors: {
    emailexist: "Nope"
  }
})

和输入字段html代码:

<input id="applicant-email" required data-table="Applicant email address" data-emaildup="false" data-emailexist="email" data-emailexist-error="Enter an existant email" data-emaildup-error="You can't use the same email address more than once" data-pattern-error="Please enter a valid email address" data-required-error="Please enter an Email address."  name="applicant-email" type="email" class="multisteps-form__input form-control"  placeholder="Email address">
<div class="help-block with-errors"></div>
4

0 回答 0