0
我對Javascript和所有人都很新。我現在正在註冊頁面上工作。我使用了我的朋友給出的模板,我正試圖使它與Laravel 5.3一起工作。如何重置Jquery遠程驗證
我想在這裏實現的是:驗證電子郵件是否已經在數據庫中。現在驗證工作。它會告訴您電子郵件是否存在。但一旦完成,無論用戶如何更改電子郵件輸入,它總是顯示電子郵件已被採取。
var form = $(".form-signup");
$('#submit-form').click(function(e) {
form.validate({
rules: {
name: {
required: true,
minlength: 3
},
email: {
required: true,
email: true,
remote: {
url: "/check/",
type: "get"
}
},
password: {
required: true,
minlength: 6,
maxlength: 16
},
password2: {
required: true,
minlength: 6,
maxlength: 16,
equalTo: '#password'
},
terms: {
required: true
}
},
messages: {
name: {
required: 'Enter your first name',
minlength: 'Enter at least 3 characters or more'
},
email: {
required: 'Enter email address',
email: 'Enter a valid email address',
remote: 'Email has been taken'
},
password: {
required: 'Write your password',
minlength: 'Minimum 6 characters',
maxlength: 'Maximum 16 characters'
},
password2: {
required: 'Write your password',
minlength: 'Minimum 6 characters',
maxlength: 'Maximum 16 characters',
equalTo: '2 passwords must be the same'
},
terms: {
required: 'You must agree with terms'
}
},
errorPlacement: function(error, element) {
console.log(element);
if (element.is(":radio") || element.is(":checkbox")) {
element.closest('.option-group').after(error);
} else {
error.insertAfter(element);
}
}
});
e.preventDefault();
if (form.valid()) {
$(this).addClass('ladda-button');
var l = Ladda.create(this);
l.start();
setTimeout(function() {
//AJAX added.
var formData = {
_token:$(this).data('token'),
name: $('#name').val(),
email: $('#email').val(),
password: $('#password').val(),
password_confirmation: $('#password2').val()
};
$.ajax({
type: 'POST',
url: '/register',
beforeSend: function (xhr) {
var token = $('meta[name="csrf_token"]').attr('content');
if (token) {
return xhr.setRequestHeader('X-CSRF-TOKEN', token);
}
},
data: formData,
dataType: 'json',
statusCode: {
200: function (data) {
console.log('success');
console.log(data);
},
500: function (data) {
console.log(data);
}
}
});
}, 2000);
} else {
alert('not valid');
}
});
}
這裏是我的前端
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta content="" name="description" />
<meta content="themes-lab" name="author" />
<meta name="csrf_token" content="{{ csrf_token() }}" />
<link rel="shortcut icon" href="{{asset('admin_assets/images/favicon.png')}}">
<link href="{{asset('admin_assets/css/style.css')}}" rel="stylesheet">
<link href="{{asset('admin_assets/css/ui.css')}}" rel="stylesheet">
<link href="{{asset('admin_assets/plugins/icheck/skins/all.css')}}" rel="stylesheet"/>
<link href="{{asset('admin_assets/plugins/bootstrap-loading/lada.min.css')}}" rel="stylesheet">
</head>
<body class="account separate-inputs boxed" data-page="signup">
<!-- BEGIN LOGIN BOX -->
<div class="container" id="login-block">
<div class="row">
<div class="col-sm-6 col-md-6 col-md-offset-3">
<div class="account-wall">
<i class="user-img icons-faces-users-03"></i>
<form class="form-signup" role="form">
<div class="append-icon">
<input type="text" name="name" id="name" class="form-control form-white name" placeholder="Name" required autofocus>
<i class="icon-user"></i>
</div>
<div class="append-icon">
<input type="email" name="email" id="email" class="form-control form-white email" placeholder="Email" required>
<i class="icon-envelope"></i>
</div>
<div class="append-icon">
<input type="password" name="password" id="password" class="form-control form-white password" placeholder="Password" required>
<i class="icon-lock"></i>
</div>
<div class="append-icon m-b-20">
<input type="password" name="password2" id="password2" class="form-control form-white password2" placeholder="Repeat Password" required>
<i class="icon-lock"></i>
</div>
<div class="terms option-group">
<label for="terms" class="m-t-10">
<input type="checkbox" name="terms" id="terms" data-checkbox="icheckbox_square-blue" required/>
I agree with terms and conditions
</label>
</div>
<button type="submit" id="submit-form" class="btn btn-lg btn-dark m-t-20" data-style="expand-left">Register</button>
<div class="clearfix">
<p class="pull-right m-t-20"><a href="user-login-v1.html">Already have an account? Sign In</a></p>
</div>
</form>
</div>
</div>
</div>
</div>
<!-- END LOCKSCREEN BOX -->
<script src="{{asset('admin_assets/plugins/jquery/jquery-1.11.1.min.js')}}"></script>
<script src="{{asset('admin_assets/plugins/jquery/jquery-migrate-1.2.1.min.js')}}"></script>
<script src="{{asset('admin_assets/plugins/gsap/main-gsap.min.js')}}"></script>
<script src="{{asset('admin_assets/plugins/bootstrap/js/bootstrap.min.js')}}"></script>
<script src="{{asset('admin_assets/plugins/icheck/icheck.min.js')}}"></script>
<script src="{{asset('admin_assets/plugins/backstretch/backstretch.min.js')}}"></script>
<script src="{{asset('admin_assets/plugins/bootstrap-loading/lada.min.js')}}"></script>
<script src="{{asset('admin_assets/plugins/jquery-validation/jquery.validate.min.js')}}"></script>
<script src="{{asset('admin_assets/plugins/jquery-validation/additional-methods.min.js')}}"></script>
<script src="{{asset('admin_assets/js/plugins.js')}}"></script>
<script src="{{asset('admin_assets/js/pages/login-v1.js')}}"></script>
</body>
</html>
因此,基本上,一旦用戶輸入一個常用的電子郵件和接收錯誤信息,他們將無法進行,並且按鈕將保持紡紗。
任何一個能提出任何可行的解決方案?解決這個問題將會很好。謝謝!