Всем доброго дня! не получается решить вопрос. Есть форма обратной связи, но при нажатии отправить открывается пустая страница. Вот форма - http://praktikum-dostizhenij.ru/contact.html
Весь код уже с правками
Код выглядит так (1й код из файла js, второй html):
$(document).ready(function(){
(function($) {
"use strict";
jQuery.validator.addMethod('answercheck', function (value, element) {
return this.optional(element) || /^\bcat\b$/.test(value)
}, "type the correct answer -_-");
// validate contactForm form
$(function() {
$('#contactForm').validate({
rules: {
name: {
required: true,
minlength: 2
},
subject: {
required: true,
minlength: 4
},
number: {
required: true,
minlength: 5
},
email: {
required: true,
email: true
},
message: {
required: true,
minlength: 20
}
},
messages: {
name: {
required: "Напишите, пожалуйста, ваше имя",
minlength: "Введено слишком мало символов"
},
subject: {
required: "Напишите, пожалуйста, тему сообщения",
minlength: "В вашей теме написано меньше 4 символов"
},
number: {
required: "Напишите, пожалуйста, ваш номер телефона",
minlength: "Номер слишком короткий"
},
email: {
required: "Напишите, пожалуйста, ваш email"
},
message: {
required: "Напишите, пожалуйстс, текст сообщения",
minlength: "Слишком короткий текст"
}
},
submitHandler: function(form) {
$(form).ajaxSubmit({
type:"POST",
data: $(form).serialize(),
url:"contact_process.php",
success: function() {
$('#contactForm :input').attr('disabled', 'disabled');
$('#contactForm').fadeTo( "slow", 1, function() {
$(this).find(':input').attr('disabled', 'disabled');
$(this).find('label').css('cursor','default');
$('#success').fadeIn()
$('.modal').modal('hide');
$('#success').modal('show');
})
},
error: function() {
$('#contactForm').fadeTo( "slow", 1, function() {
$('#error').fadeIn()
$('.modal').modal('hide');
$('#error').modal('show');
})
}
})
}
})
})
})(jQuery)
})
<form
class="row contact_form"
action="contact_process.php"
method="post"
id="contactForm"
novalidate="novalidate"
>
<div class="col-md-6">
<div class="form-group">
<input
type="text"
class="form-control"
id="name"
name="name"
placeholder="Ваше имя"
onfocus="this.placeholder = ''"
onblur="this.placeholder = 'Ваше имя'"
required=""
/>
</div>
<div class="form-group">
<input
type="email"
class="form-control"
id="email"
name="email"
placeholder="Ваш email"
onfocus="this.placeholder = ''"
onblur="this.placeholder = 'Ваш email'"
required=""
/>
</div>
<div class="form-group">
<input
type="text"
class="form-control"
id="subject"
name="subject"
placeholder="Тема сообщения"
onfocus="this.placeholder = ''"
onblur="this.placeholder = 'Тема сообщения'"
required=""
/>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<textarea
class="form-control"
name="message"
id="message"
rows="1"
placeholder="Введите сообщение"
onfocus="this.placeholder = ''"
onblur="this.placeholder = 'Введите сообщение'"
required=""
></textarea>
</div>
</div>
<div class="col-md-12 text-right">
<button type="submit" value="submit" class="btn primary-btn">
Отправить
</button>
</div>
</form>
</div>
</div>
</div>
</section>
<!--================Contact Area =================-->
<!--================Contact Success and Error message Area =================-->
<div id="success" class="modal modal-message fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button
type="button"
class="close"
data-dismiss="modal"
aria-label="Close"
>
<i class="ti-close"></i>
</button>
<h2>Благодарим!</h2>
<p>Ваше сообщение успешно отправлено...</p>
</div>
</div>
</div>
</div>
<!-- Modals error -->
<div id="error" class="modal modal-message fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button
type="button"
class="close"
data-dismiss="modal"
aria-label="Close"
>
<i class="ti-close"></i>
</button>
<h2>Извините!</h2>
<p>Произошла ошибка. Попробуйте еще раз.</p>
</div>
</div>
</div>
</div>
В php файле contact_process.php (в корневом каталоге)
<?php
$to = "youremail@mail.ru";
$from = $_REQUEST['email'];
$name = $_REQUEST['name'];
$subject = $_REQUEST['subject'];
$cmessage = $_REQUEST['message'];
$headers = "From: $from";
$headers = "From: " . $from . "\r\n";
$headers .= "Reply-To: " . $from . "\r\n";
$headers .= "MIME-Version: 1.0\r\n";
$headers .= "Content-Type: text/html; charset=UTF-8\r\n";
$csubject = "Сообщение из Академии ПРАКТИКУМ ДОСТИЖЕНИЙ";
$logo = 'http://praktikum-dostizhenij.ru/img/logo.png';
$link = 'http://praktikum-dostizhenij.ru/';
$body = "<!DOCTYPE html><html lang='ru'><head><meta charset='UTF-8'><title>Сообщение</title></head><body>";
$body .= "<table style='width: 100%;'>";
$body .= "<thead style='text-align: center;'><tr><td style='border:none;' colspan='2'>";
$body .= "<a href='{$link}'><img src='{$logo}' alt=''></a><br><br>";
$body .= "</td></tr></thead><tbody><tr>";
$body .= "<td style='border:none;'><strong>От кого:</strong> {$name}</td>";
$body .= "<td style='border:none;'><strong>Email:</strong> {$from}</td>";
$body .= "</tr>";
$body .= "<tr><td style='border:none;'><strong>Тема:</strong> {$subject}</td></tr>";
$body .= "<tr><td></td></tr>";
$body .= "<tr><td colspan='2' style='border:none;'>{$cmessage}</td></tr>";
$body .= "</tbody></table>";
$body .= "</body></html>";
$send = mail($to, $csubject, $body, $headers);
?>
файл mail-script.js
// ------- Mail Send ajax
$(document).ready(function() {
var form = $('#myForm'); // contact form
var submit = $('.submit-btn'); // submit button
var alert = $('.alert-msg'); // alert div for show alert message
// form submit event
form.on('submit', function(e) {
e.preventDefault(); // prevent default form submit
$.ajax({
url: 'mail.php', // form action url
type: 'POST', // form submit method get/post
dataType: 'html', // request type html/json/xml
data: form.serialize(), // serialize form data
beforeSend: function() {
alert.fadeOut();
submit.html('Sending....'); // change submit button text
},
success: function(data) {
alert.html(data).fadeIn(); // fade in response data
form.trigger('reset'); // reset form
submit.attr("style", "display: none !important");; // reset submit button text
},
error: function(e) {
console.log(e)
}
});
});
});
К сожалению, моих знаний не хватает. Буду очень рада помощи.
contact_process.php
. Вам надо отменить стандартное событие сабмита.