如何在我的表单上为我的电子邮件添加远程验证规则

时间:2018-06-01 01:34:38

标签: javascript jquery email-validation

我现在没有收到任何错误,我确实得到了我的请求的响应,但我正在尝试使用我在此forum中建议的回调函数..我正在寻求一些帮助一个比我更了解的人... thx

我想要做的是使用.validate()来确认输入的val()电子邮件不在数据库中...

这就是我所拥有的:

$(function(){
		
		$.validator.setDefaults({
			errorClass: 'help-block',
			highlight: function(element){
				$(element)
				.closest('.form-group')
				.addClass('has-error');
				},
			unhighlight: function(element){
				$(element)
				.closest('.form-group')
				.removeClass('has-error');
				
				 },
    		errorPlacement: function (error, element) {
      			if (element.prop('type') === 'checkbox') {
        		error.insertAfter(element.parent());
      		} else {
        error.insertAfter(element);
			}
				}
			});
		
		var urlgetzoho = //here is were I put the URL to the server
		
		$.validator.addMethod("strongPassword", function(value, element){
			return this.optional(element)
			|| value.length >= 6
			&& /\d/.test(value)
			&& /[a-z]/i.test(value);
			}, 
			"Your password must be at least 6 characters long and contain at least one number and one characters")
		
		
		  validator = $("#sellerInformation").validate({
			rules:{
				email:{
					required: true,
					email: true,
					remote: {
					type: "GET",
					url: urlgetzoho,
					data:{
					email: function(){
								return $('input[email]').val();
					}
					  },
					 dataType: 'jsonp',
					 jsonp: 'myCallback'
					  }
				},
					  
					 password: {
						 required: true,
						 strongPassword: true
						 },
						 
					 password2: {
						 required: true,
						 equalTo: "#password"

			},
			firstName: {
        required: true,
        nowhitespace: true,
        lettersonly: true
      },
      secondName: {
        required: true,
        nowhitespace: true,
        lettersonly: true
      },
      street: {
        required: true
      },
      phone: {
        required: true,
        digits: true,
        phoneUS: true
      },
      state: {
        required: true,
		statesUS: true
      },
	  askingprice: {
        required: true,
		currency: true
      },
      city: {
        required: true,
        lettersonly: true
      },
      zipcode: {
        required: true,
       zipcodeUS: true
      },
      terms: {
        required: true
      }
},
				messages:{
					email: {
						required: "Please enter an email address.",
						email: "Please enter a <em>valid</em> email address.",
						remote: $.validator.format("{0} is already associated with an account.")
						}
				}
			});
		
			myCallback = function(data){
			console.log("myCallback data is :" + data);
			if (data !== "true")
			validator.showErrors({
				"email": "This email is already used"
			});
		};	
	});
<!-- Animation library for notifications   -->
    <link href="assets/css/animate.min.css" rel="stylesheet"/>

    <!--  Light Bootstrap Table core CSS    -->
    <link href="assets/css/light-bootstrap-dashboard.css" rel="stylesheet"/>
    
     <!--     Fonts and icons     -->
    <link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
    <link href='http://fonts.googleapis.com/css?family=Roboto:400,700,300' rel='stylesheet' type='text/css'>
    <link href="assets/css/pe-icon-7-stroke.css" rel="stylesheet" />
  
  <link href="https://bootswatch.com/3/superhero/bootstrap.min.css" rel="stylesheet" type="text/css">
<link href="stylesheets/light-bootstrap.css" rel="stylesheet" type="text/css">
<form id="sellerInformation" method="POST" name="sellerInformation" action="here is were I put the URL to the server">
<input type="hidden" name ="authtoken" value="xxxxxxxxxxxxxxxx">
<input type="hidden" name ="scope" id="scope" value="creatorapi">
      
      <fieldset>
        <legend>Sign up for a business account</legend>
      </fieldset>
      <p>Create a login</p>

      <div class="form-group col-md-12">
        <input class="form-control" name="email" placeholder="Email address" type="email">
      </div>
      <div class="form-group col-md-6">
        <input class="form-control" name="password" id="password" placeholder="Password" type="password">
      </div>
      <div class="form-group col-md-6">
        <input class="form-control" name="password2" placeholder="Re-enter password" type="password">
      </div>
      <div class="clearfix">
      </div>
      <p>Tell us about your business</p>
      
      <div class="form-group col-md-4">
 <input class="form-control" id="First_Name" name="firstName" placeholder="First name" type="text">
      </div>
      
     <div class="form-group col-md-4">
       <input class="form-control" id="Last_Name" name="secondName" placeholder="Last name" type="text">
     </div>
     
     <div class="form-group col-md-4">
       <input class="form-control" id="Phone" name="phone" placeholder="Conact Number" type="tel">
     </div>

     <div class="form-group col-md-4">
  <input class="form-control" name="street" id="Street" placeholder="Mailing Address" type="text">
     </div>

     <div class="form-group col-md-3">
       <input class="form-control" id="City" name="city" placeholder="City" type="text">
     </div>
     
     <div class="form-group col-md-2">
       <input class="form-control" name="state" placeholder="State" type="text">
     </div>

     <div class="form-group col-md-3">
       <input class="form-control" name="zipcode" placeholder="Zip Code" type="number">
     </div>
     
     <div class="clearfix">
      </div>
<p>Pre-Screening Info</p>

  <div class="form-group col-md-12">                          
<label>Asking Price</label>
<input type="text" name="askingprice" class="form-control" placeholder="Asking Price">
</div>

     <div class="form-group col-md-12">
       <div class="checkbox">
         <label>
           <input id="terms" name="terms" type="checkbox"> 
           I have read, consent and agree to Company's User Agreement and Privacy Policy
           (including the processing and disclosing of my personal data), and I am of 
           legal age. I understand that I can change my communication preferences at any
           time. Please read the Key Payment and ServiceInformation.
         </label>
       </div>
     </div>
      <div>
        <input class="btn btn-primary" id="submit-button" type="submit" value="Update Seller Lead"  >
      </div>

    </form>

0 个答案:

没有答案