Как отправить запрос AJAX в WordPress

Что такое AJAX-запрос

Запрос AJAX — это простой запрос GET или POST к URL-адресу. Вы передаете некоторые пользовательские параметры, и этот URL-адрес отвечает вам некоторыми данными. Вы можете прочитать эти данные с помощью JavaScript и выполнить дальнейшие действия в соответствии с данными.

Запрос AJAX используется для передачи данных между клиентом и сервером без перезагрузки или обновления всей страницы.

AJAX-запрос в WordPress

В наши дни почти все фреймворки и CMS используют собственный метод маршрутизации HTTP/HTTPS-запросов. WordPress также использует ту же концепцию. В WordPress мы отправляем все AJAX-запросы на общий URL-адрес, затем wordpress внутренне вызывает соответствующий метод в соответствии с параметрами, которые мы отправили с запросом.

Общий URL-адрес для отправки запроса: http://domain.com/wp-admin/admin-ajax.php.
Вы можете использовать функцию WordPress admin_url(‘admin-ajax.php’), чтобы получить этот URL.

Мы пишем скрипт на обеих сторонах (клиент и сервер) для отправки и обработки запроса AJAX.

Действие клиента

Мы используем JavaScript/jQuery для написания сценария действия клиента. Вот простой код, который вы можете использовать для отправки запроса AJAX с параметрами:

jQuery(document).ready({
  var data = {
    'action': 'my_ajax_request',
    'post_type': 'POST',
    'name': 'My First AJAX Request'
  };

  jQuery.post("", data, function(response) {
    console.log( response );
  }, 'json');
});

Действие сервера

После отправки запроса AJAX через JavaScript/jQuery мы должны обработать этот запрос на сервере, чтобы отправить ответ клиенту. Мы используем действия WordPress для обработки этого запроса AJAX. WordPress прочитает значение параметра действия, чтобы вызвать соответствующий метод на сервере. В приведенном выше случае мы использовали «my_ajax_request».

Теперь вам нужно добавить приведенную ниже функцию в файл functions.php темы WordPress.

  add_action( 'wp_ajax_my_ajax_request', 'tft_handle_ajax_request' );
  add_action( 'wp_ajax_nopriv_my_ajax_request', 'tft_handle_ajax_request' );
  function tft_handle_ajax_request() {
    $name	= isset($_POST['name'])?trim($_POST['name']):"";
    $response	= array();
    $response['message']	= "Successfull Request";
    echo json_encode($response);
    exit;
  }

Мы можем использовать этот ответ в обработчике JavaScript для обработки ответа.