Вопрос или проблема
Я пытаюсь отправить следующую форму, но у меня это не получается:
HTML:
<div class= "container">
<div class="row">
<div class= "col-md-10 mx-auto text-center">
<div style="display:none;" id="success">
<p class="pb-1 pt-1" style="color:white;background-color:#008000;font-size:20px;font-family:poppins;border-radius:3px;border:3px solid #008000;">Ваш запрос был отправлен!</p>
</div>
<form method="POST" id="request_quote" action="request_quote_ajax">
<div class="form-group ">
<input type="hidden" name="action" value="request_quote_ajax">
<select placeholder="Продукт или услуга" class="form-control form-control-lg" id="product" type="text" name="product" required>
<option value="">Продукт или услуга</option>
<option value="Солнечная Фотовольтаическая Система">Солнечная Фотовольтаическая Система</option>
<option value="Солнечный водонагреватель">Солнечный водонагреватель</option>
<option value="Солнечное бассейное отопление">Солнечное бассейное отопление</option>
<option value="Обслуживание">Обслуживание</option>
</select>
<div class="form-group">
<div class="form-row">
<div class="col-md-6">
<input type="text" class="form-control form-control-lg" id="fullname" name="fullname" placeholder="Полное имя" required>
</div>
<div class="col-md-6">
<input type="text" class="form-control form-control-lg" id="email" name="email" placeholder="Электронная почта" required>
</div>
</div>
</div>
<div class="form-group">
<div class="form-group">
<div class="form-row">
<div class="col-md-6">
<input type="text" class="form-control form-control-lg" name="phonenumber1" id="phonenumber1" placeholder="Номер телефона 1" required>
</div>
<div class="col-md-6">
<input type="text" class="form-control form-control-lg" name="phonenumber2" id="phonenumber2" placeholder="Номер телефона 2" >
</div>
</div>
</div>
<div class="form-group">
<div class="form-row">
<div class="col-md-6">
<input type="text" class="form-control form-control-lg " id="exampleInputPassword1" placeholder="Улица, дом" name="address" required>
</div>
<div class="col-md-6">
<input type="text" class="form-control form-control-lg" id="parish" name="parish" placeholder="Приход" required>
</div>
</div>
</div>
<div class="form-group">
<textarea type="textarea" class="form-control form-control-lg" name="_usermessage" id="_usermessage" placeholder="Ваше сообщение" required></textarea>
</div>
<button type="submit" name="submit" class="btn btn-primary">ИДТИ НА СОЛНЦЕ</button>
</div>
</div>
</form>
Javascript:
<script>
$(document).ready(
$('#request_quote').submit(function(e){
e.preventDefault();
jQuery.post({
url: ajaxurl,
data: { $(this).serialize() },
die();
})
})
</script>
Я использовал следующий скрипт, чтобы сделать ajax url доступным:
add_action('wp_head', 'myplugin_ajaxurl');
function myplugin_ajaxurl()
{
echo '<script type="text/javascript">
var ajaxurl = "' . admin_url('admin-ajax.php') . '";
</script>';
}
Моя php функция выглядит следующим образом:
add_action('wp_ajax_nopriv_request_quote_ajax', 'request_quote_ajax');
add_action('wp_ajax_request_quote_ajax', 'request_quote_ajax');
function request_quote_ajax()
{
// если кнопка отправки нажата, отправляем email
if (isset($_POST['submit'])) {
//переменные, введенные пользователем
$name = sanitize_text_field($_POST['fullname']);
$email = sanitize_email($_POST['email']);
$product = sanitize_text_field($_POST['product']);
$phonenumber1 = sanitize_text_field($_POST['phonenumber1']);
$phonenumber2 = sanitize_text_field($_POST['phonenumber2']);
$address = sanitize_text_field($_POST['address']);
$parish = sanitize_text_field($_POST['parish']);
$_usermessage = esc_textarea($_POST['_usermessage']);
//объединяем все вводимые поля
$message = "Запрос на предложение : {$name} \n {$product} \n {$phonenumber1} \n {$phonenumber2} \n {$address} \n {$parish} \n {$_usermessage} ";
//php mailer переменные
$third_email = "[email protected]";
$to = $third_email;
$subject = "Запрос на квота от {$name}";
wp_mail($to, $subject, strip_tags($message));
//$headers="От: <[email protected]>" . "\r\n" .'Ответить: ' . $email . "\r\n";
}
else{ do_action( 'wp_mail_failed', WP_Error, $error ); }
wp_die();
}
Каждый раз, когда я пытаюсь отправить форму, я получаю ошибку 404. Я попробовал все решения на подобные сообщения, но ни одно из них не сработало, пожалуйста, помогите мне
Ваш атрибут action в теге формы неверен. Вы можете удалить его, ваша функция отправки jQuery выполнит работу.
При попытке выполнить действие в функциях WP вам всегда нужно передавать имя действия в данных POST. В файле JavaScript измените на:
data: { $(this).serialize(), action: ‘request_quote_ajax’}
.
Ответ или решение
Ошибка 404 при работе с admin-ajax.php
в WordPress часто возникает из-за неправильной настройки AJAX-запросов. В вашем случае, судя по предоставленному коду и описанию проблемы, есть несколько ключевых аспектов, которые следует рассмотреть и исправить. Давайте подробнее рассмотрим шаги для устранения ошибки.
1. Проверка URL для AJAX-запросов
Вы используете следующую строку для определения переменной ajaxurl
:
echo '<script type="text/javascript">
var ajaxurl = "' . admin_url('admin-ajax.php') . '";
</script>';
Это правильно, так как admin_url('admin-ajax.php')
генерирует корректный URL. Убедитесь, что это работает должным образом и URL возвращает http://ваш-домен/wp-admin/admin-ajax.php
.
2. Корректировка отправки данных с формы
В вашем JavaScript-коде есть ошибка в том, как вы передаете данные в AJAX-запросе. Измените следующую строку:
data: { $(this).serialize() },
на
data: $(this).serialize() + '&action=request_quote_ajax',
Полный скрипт будет выглядеть так:
<script>
$(document).ready(function() {
$('#request_quote').submit(function(e) {
e.preventDefault();
jQuery.post({
url: ajaxurl,
data: $(this).serialize() + '&action=request_quote_ajax',
success: function(response) {
// Здесь вы можете обработать ответ от сервера
$('#success').show();
},
error: function() {
// Обработайте ошибку
alert('Произошла ошибка при отправке запроса.');
}
});
});
});
</script>
3. Удаление атрибута action из формы
В форме (<form>
), атрибут action
можно удалить, так как AJAX будет обрабатывать отправку данных. Этот атрибут не нужен, поскольку обработка происходит в JavaScript:
<form method="POST" id="request_quote">
4. Обработка данных на сервере
Ваш PHP-код, отвечающий за обработку AJAX-запроса, выглядит в целом хорошо. Однако убедитесь, что вы корректно проверяете отсутствие ошибок и выполняете все действия в правильном порядке.
5. Проверка привилегий
Убедитесь, что ваш пользователь не имеет ограничений на выполнение AJAX-заказов. Вызовы wp_ajax_nopriv_
и wp_ajax_
позволяют обрабатывать запросы от незалогиненных и залогиненных пользователей соответственно, поэтому их реализация выглядит корректно.
6. Дебагинг
Если после внесения поправок вы все еще получаете 404 ошибку, попробуйте:
- Откройте консоль браузера (обычно F12) и проверьте вкладку "Сеть" для поиска более детальной информации об отправляемых запросах.
- Убедитесь, что данные корректно отправляются и сервер отвечает на запросы.
- Проверьте файл
.htaccess
или конфигурацию сервера на наличие возможных ограничений.
Заключение
Следуя вышеуказанным шагам, вы сможете устранить ошибку 404 и успешно отправлять запросы на admin-ajax.php
. Убедитесь, что ваши AJAX-запросы корректно настроены как на стороне клиента, так и на стороне сервера, и это поможет в выполнении запросов без ошибок. Если возникнут дополнительные сложности, рассмотрите возможность включения отладочной информации для более детального анализа проблемы.