Всем доброго времени суток друзья помогите с обработчиком ajax на WordPress. У меня на сайте есть форма обратной связи я хотел бы что бы она работала на AJAX. Я пытаюсь это сделать но у меня не чего не получается. Потому что я не имею знаний в AJAX и не гуру в программировании я хотел бы что бы когда пользователь нажмет на один из шести чекбоксов это может быть несколько чекбосов сразу с выбранной проблемой, введет свой телефон и имя мне на почту приходило письмо с его выбранной проблемой, именем и телефоном. Я создал папку в директории wp-content/plugins в папке /my-plygin я создал файл и назвал его mail_ajax.php. Далее я в него добавил код
<?php
/*
Plugin Name: Ajax_Mail
*/
add_action( 'wp_enqueue_scripts', 'my_enqueue_scripts' );
function my_enqueue_scripts() {
wp_enqueue_script( 'my-ajax-script', plugin_dir_url( __FILE__ ) . '/assets/components/ajaxform/js/default.js', array( 'jquery' ) );
wp_localize_script( 'my-ajax-script', 'my_ajax_object', array( 'ajax_url' => admin_url( 'admin-ajax.php' ) ) );
}
add_action( 'wp_ajax_send_mail_ajax', 'send_mail_ajax_callback' );
add_action( 'wp_ajax_nopriv_send_mail_ajax', 'send_mail_ajax_callback' );
function send_mail_ajax_callback() {
// получаем данные из запроса
$problem = $_POST['problem'];
$callbackfio = $_POST['callbackfio'];
$callbacktel = $_POST['callbacktel'];
$iagree = $_POST['iagree'];
// проверяем, что все поля заполнены
if ( empty( $problem ) || empty( $callbackfio ) || empty( $callbacktel ) || empty( $iagree ) ) {
echo json_encode( array( 'success' => false, 'message' => 'Заполните все поля формы.' ) );
wp_die();
}
// отправляем письмо на почту администратора сайта
$to = 'sales@skvazhinaremont.ru';
$subject = 'Новая заявка с сайта';
$body = 'Проблема: ' . implode( ', ', $problem ) . "\n";
$body .= 'Имя: ' . $callbackfio . "\n";
$body .= 'Телефон: ' . $callbacktel . "\n";
$headers = array( 'Content-Type: text/html; charset=UTF-8' );
wp_mail( $to, $subject, $body, $headers );
// отправляем ответ клиенту
echo json_encode( array( 'success' => true, 'message' => 'Спасибо за обращение, сообщение отправлено. Наш менеджер перезвонит вам в ближайшее время.' ) );
wp_die();
}
?>
Всем доброго времени суток друзья помогите с обработчиком ajax на WordPress. У меня на сайте есть форма обратной связи я хотел бы что бы она работала на AJAX. Я пытаюсь это сделать но у меня не чего не получается. Потому что я не имею знаний в AJAX и не гуру в программировании я хотел бы что бы когда пользователь нажмет на один из шести чекбоксов это может быть несколько чекбосов сразу с выбранной проблемой, введет свой телефон и имя мне на почту приходило письмо с его выбранной проблемой, именем и телефоном. Я создал папку в директории wp-content/plugins в папке /my-plygin я создал файл и назвал его mail_ajax.php. Далее я в него добавил код
<?php
/*
Plugin Name: Ajax_Mail
*/
add_action( 'wp_enqueue_scripts', 'my_enqueue_scripts' );
function my_enqueue_scripts() {
wp_enqueue_script( 'my-ajax-script', plugin_dir_url( __FILE__ ) . '/assets/components/ajaxform/js/default.js', array( 'jquery' ) );
wp_localize_script( 'my-ajax-script', 'my_ajax_object', array( 'ajax_url' => admin_url( 'admin-ajax.php' ) ) );
}
add_action( 'wp_ajax_send_mail_ajax', 'send_mail_ajax_callback' );
add_action( 'wp_ajax_nopriv_send_mail_ajax', 'send_mail_ajax_callback' );
function send_mail_ajax_callback() {
// получаем данные из запроса
$problem = $_POST['problem'];
$callbackfio = $_POST['callbackfio'];
$callbacktel = $_POST['callbacktel'];
$iagree = $_POST['iagree'];
// проверяем, что все поля заполнены
if ( empty( $problem ) || empty( $callbackfio ) || empty( $callbacktel ) || empty( $iagree ) ) {
echo json_encode( array( 'success' => false, 'message' => 'Заполните все поля формы.' ) );
wp_die();
}
// отправляем письмо на почту администратора сайта
$to = 'sales@skvazhinaremont.ru';
$subject = 'Новая заявка с сайта';
$body = 'Проблема: ' . implode( ', ', $problem ) . "\n";
$body .= 'Имя: ' . $callbackfio . "\n";
$body .= 'Телефон: ' . $callbacktel . "\n";
$headers = array( 'Content-Type: text/html; charset=UTF-8' );
wp_mail( $to, $subject, $body, $headers );
// отправляем ответ клиенту
echo json_encode( array( 'success' => true, 'message' => 'Спасибо за обращение, сообщение отправлено. Наш менеджер перезвонит вам в ближайшее время.' ) );
wp_die();
}
?>
Развернуть фрагмент
Далее перешел в админ панель WordPress плагины и активировал плагин Ajax_Mail который я создал в директории /wp-content/plugins/my-plygin.
Это js код который находиться в директории /assets/components/ajaxform/js/ и называется default.js
var AjaxForm = {
initialize: function (afConfig) {
if (!jQuery().ajaxForm) {
document.write('<script src="' + afConfig['assetsUrl'] + '/js/lib/jquery.form.min.js"><\/script>');
}
if (!jQuery().jGrowl) {
document.write('<script src="' + afConfig['assetsUrl'] + '/js/lib/jquery.jgrowl.min.js"><\/script>');
}
$(document).ready(function () {
$.jGrowl.defaults.closerTemplate = '<div>[ ' + afConfig['closeMessage'] + ' ]</div>';
});
$(document).off('submit', afConfig['formSelector']).on('submit', afConfig['formSelector'], function (e) {
$(this).ajaxSubmit({
dataType: 'json',
data: {pageId: afConfig['pageId']},
url: afConfig['actionUrl'],
beforeSerialize: function (form) {
form.find(':submit').each(function () {
if (!form.find('input[type="hidden"][name="' + $(this).attr('name') + '"]').length) {
$(form).append(
$('<input type="hidden">').attr({
name: $(this).attr('name'),
value: $(this).attr('value')
})
);
}
})
},
beforeSubmit: function (fields, form) {
//noinspection JSUnresolvedVariable
if (typeof(afValidated) != 'undefined' && afValidated == false) {
return false;
}
form.find('.error').html('');
form.find('.error').removeClass('error');
form.find('input,textarea,select,button').attr('disabled', true);
return true;
},
success: function (response, status, xhr, form) {
form.find('input,textarea,select,button').attr('disabled', false);
response.form = form;
$(document).trigger('af_complete', response);
if (!response.success) {
AjaxForm.Message.error(response.message);
if (response.data) {
var key, value, focused;
for (key in response.data) {
if (response.data.hasOwnProperty(key)) {
if (!focused) {
form.find('[name="' + key + '"]').focus();
focused = true;
}
value = response.data[key];
form.find('.error_' + key).html(value).addClass('error');
form.find('[name="' + key + '"]').addClass('error');
}
}
}
}
else {
AjaxForm.Message.success(response.message);
form.find('.error').removeClass('error');
form[0].reset();
//noinspection JSUnresolvedVariable
if (typeof(grecaptcha) != 'undefined') {
//noinspection JSUnresolvedVariable
grecaptcha.reset();
}
}
}
});
e.preventDefault();
return false;
});
$(document).on('keypress change', '.error', function () {
var key = $(this).attr('name');
$(this).removeClass('error');
$('.error_' + key).html('').removeClass('error');
});
$(document).on('reset', afConfig['formSelector'], function () {
$(this).find('.error').html('');
AjaxForm.Message.close();
});
}
};
//noinspection JSUnusedGlobalSymbols
AjaxForm.Message = {
success: function (message, sticky) {
if (message) {
if (!sticky) {
sticky = false;
}
$.jGrowl(message, {theme: 'af-message-success', sticky: sticky});
}
},
error: function (message, sticky) {
if (message) {
if (!sticky) {
sticky = false;
}
$.jGrowl(message, {theme: 'af-message-error', sticky: sticky});
}
},
info: function (message, sticky) {
if (message) {
if (!sticky) {
sticky = false;
}
$.jGrowl(message, {theme: 'af-message-info', sticky: sticky});
}
},
close: function () {
$.jGrowl('close');
},
};
Сложный
Простой
