有人能帮忙看看我的代码吗?我用Ajax重复两次发送了数据,所以我的db记录也重复了:
<script type="text/javascript">
function isValidEmailAddress(email) {
var regex = /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i;
return regex.test(email);
}
function check() {
var registration = $('input');
registration.removeClass('error').removeClass('valid');
var error = 0;
registration.each(function () {
var value = $(this).val();
if (value.length < 4 || value === null) {
$(this).addClass('error').animate({ opacity: 0.5}, 500);
error++;
} else {
$(this).addClass('valid');
}
});
if (!error) {
if ($('#password').val() != $('#conf_password').val()) {
$('input[type=password]').each(function () {
$(this).removeClass('valid').addClass('error');
});
}
var email = $('input[type=email]').val();
if (email.length < 1 || email.value == null && !isValidEmailAddress(email)) {
$(this).addClass('error');
error++;
}
else {
$(this).addClass('valid');
}
}
}
function send_form() {
check();
var data = $('#registration').serialize();
$.ajax({
type: "POST",
url: "{{ path('registrationAction') }}",
data: data,
dataType : 'json',
success: function (data) {
if(data.success == true){
window.location.replace("{{ path('loginAction') }}");
}
else
alert("Error");
}
}
);
}
$(function () {
$('#submit_form').click(function () {
send_form();
});
});
</script>
还有一个问题,我的表格在不应该发送的情况下也会被发送出去,这又是为什么......我该怎么办?我是不是遗漏了某些东西?
Have a global variable
var req_sent = 0;
before ajax request put
if(req_sent == 1){
return;
}
req_sent = 1;
in success and error callbacks of ajax set
req_sent = 0
Have a validator method called on form submit
<form onsubmit="checkIfValid()">....
This method should return false if form is not valid. Your form will not be submitted.
You do not prevent normal form submission while submitting it via AJAX. Also, it is better to bind form submission to your form submit
event, rather than your submit button click
, because forms are also submitted for example on Enter
keypress. You need to do the following:
$(function () {
$('#form-name').submit(function (event) {
event.preventDefault();
send_form();
});
});
In the form submit event give return false or else your form gets submitted post your ajax.
$(function () {
$('#submit_form').click(function () {
send_form();
return false;
});
});