Как исправить перенаправление формы ajax на страницу почтовой программы - PullRequest
Новая
       11

Как исправить перенаправление формы ajax на страницу почтовой программы

0 голосов
/ 28 января 2019

Я разрабатываю форму contactus на html-странице, проверка работала отлично, этот код работал без проверки, после проверки она не работает, но страница перенаправлена ​​на mailer.php, AJAX не работает, я пробовал все, ноне работалКак я могу это исправить?Любое предложение высоко ценится.

HTML 

<form  id="ajax-contact" method="post" action="mailer.php"  class="wpcf7-form AdvancedForm" autocomplete="on">
<div class="form-group">
<input  id="cname" type="text" name="cname" value="" placeholder="NAME">
</div>
<div class="form-group">
<input id="cemail" type="email" data-missing="This field is required" data-mismatch="Please include a valid email"  name="cemail" value="" placeholder="EMAIL">
</div>
<div class="form-group">
<input id="cnumber" type="text" maxlength="15" name="cnumber" value="" placeholder="MOBILE">
</div>
<div class="form-group">
<input id="csubject" type="text" name="csubject" value="" placeholder="SUBJECT">
</div>
<div class="form-group">
<textarea id="cmessage" draggable="false" name="cmessage" placeholder="YOUR MESSAGE"></textarea>
</div>

<div class="form-group">
<button type="submit" id="submit" class="theme-btn btn-style-four">Submit</button>
</div>
<div id="form-messages"></div>
</form>

Это Jquery для проверки и условий Ajax.

JavaScript 

<script type="text/javascript">
$(function(){
$("#cname").validate({
expression: "if (VAL) return true; else return false;",
message: "Please enter the Name"
});
$("#cnumber").validate({
expression: "if (VAL.match(/^[0-9\.\-\/]+$/)) return true; else return false;",
message: "Please enter a valid Phone number"
}); 
$("#csubject").validate({
expression: "if (VAL) return true; else return false;",
message: "Please enter the Subject"
});
$("#cemail").validate({
expression: "if (VAL.match(/^[^\\W][a-zA-Z0-9\\_\\-\\.]+([a-zA-Z0-9\\_\\-\\.]+)*\\@[a-zA-Z0-9_]+(\\.[a-zA-Z0-9_]+)*\\.[a-zA-Z]{2,4}$/)) return true; else return false;",
message: "Please enter a valid Email ID"
});
$("#cmessage").validate({
expression: "if (VAL) return true; else return false;",
message: "Please enter the Message"
});

// Get the form.
var form = $('#ajax-contact');

// Get the messages div.
var formMessages = $('#form-messages');

$('.AdvancedForm').validated(function(e){
// alert("Use this call to make AJAX submissions.");

// Stop the browser from submitting the form.
e.preventDefault();

// Serialize the form data.
$(formMessages).addClass('wait').text("please wait...");


var formData = $(form).serialize();

console.log($(form).attr('action'));
console.log(formData);

// Submit the form using AJAX.
$.ajax({
type: 'POST',
url: $(form).attr('action'),
data: formData
})
.done(function(response) {
// Make sure that the formMessages div has the 'success' class.
$(formMessages).removeClass('error');
$(formMessages).addClass('success');

// Set the message text.
$(formMessages).text(response);

// Clear the form.
$('#cname').val('');
$('#cemail').val('');
$('#cnumber').val('');
$('#csubject').val('');
$('#cmessage').val('');

})
.fail(function(data) {
// Make sure that the formMessages div has the 'error' class.
$(formMessages).removeClass('success');
$(formMessages).addClass('error');

// Set the message text.
if (data.responseText !== '') {
$(formMessages).text(data.responseText);
} else {
$(formMessages).text('Oops! An error occured and your message could not be sent.');
}
});
});
});
</script>

1 Ответ

0 голосов
/ 28 января 2019

Можете ли вы инкапсулировать свои правила проверки в функцию таким образом, чтобы, если все в порядке, функция возвращала истину, а затем использовала оператор if для проверки, например 

if($validation){
then handle the ajax form submit
}
...