Две связанные таксономии. Как синхронизировать их на странице редактирования записи?

Вопрос или проблема

У меня есть две пользовательские таксономии на сайте – Страны и Города.

Термины таксономии Городов имеют метабокс, связанный со Страной.

У меня есть два метабокса (типа категории) на странице редактирования Пользовательского Содержимого (например, Событие).
Как я могу реализовать следующие функции:

  • по умолчанию для нового содержимого не отображать список городов, а заменить его на значение (ноль) – “Сначала выберите страну”
  • при выборе Страны (post_category_meta_box) – обновить метабокс Городов, указывая только города выбранной страны

Я буду рад любой помощи.
Примечание: содержание может быть связано с разными странами и несколькими городами.

Ответ или решение

Чтобы реализовать синхронизацию двух связанных таксономий (страны и города) на странице редактирования поста в WordPress, необходимо использовать JavaScript для динамического обновления метабокса городов в зависимости от выбранной страны. Ниже приведены шаги для реализации данной функциональности.

Шаг 1: Создание метабоксов

Вам нужно создать оба метабокса для таксономий на странице редактирования. Если метабоксы уже созданы, убедитесь, что они отображаются правильно.

function custom_meta_boxes() {
    add_meta_box('country_meta_box', 'Выберите страну', 'country_meta_box_callback', 'custom_content', 'side', 'high');
    add_meta_box('city_meta_box', 'Выберите город', 'city_meta_box_callback', 'custom_content', 'side', 'high');
}
add_action('add_meta_boxes', 'custom_meta_boxes');

function country_meta_box_callback($post) {
    // Здесь вы можете отобразить выбор стран
    $countries = get_terms(array(
        'taxonomy' => 'countries',
        'hide_empty' => false,
    ));

    echo '<select name="country_select" id="country_select">';
    echo '<option value="">Выберите страну</option>';
    foreach ($countries as $country) {
        echo '<option value="' . esc_attr($country->term_id) . '">' . esc_html($country->name) . '</option>';
    }
    echo '</select>';
}

function city_meta_box_callback($post) {
    // Здесь вы можете отобразить выбор городов
    echo '<select name="city_select" id="city_select">';
    echo '<option value="">Сначала выберите страну</option>';
    echo '</select>';
}

Шаг 2: Добавление JavaScript для динамического обновления

Теперь необходимо добавить JavaScript, чтобы обновить метабокс городов в зависимости от выбора страны. Вы можете использовать AJAX для получения списка городов.

function enqueue_scripts() {
    wp_enqueue_script('custom_meta_boxes_script', get_template_directory_uri() . '/js/custom-meta-boxes.js', array('jquery'), null, true);
    wp_localize_script('custom_meta_boxes_script', 'ajax_object', array('ajax_url' => admin_url('admin-ajax.php')));
}
add_action('admin_enqueue_scripts', 'enqueue_scripts');

add_action('wp_ajax_get_cities', 'get_cities');

function get_cities() {
    $country_id = intval($_POST['country_id']);
    $cities = get_terms(array(
        'taxonomy' => 'cities',
        'meta_query' => array(
            array(
                'key' => 'country_id',
                'value' => $country_id,
                'compare' => '='
            )
        ),
        'hide_empty' => false,
    ));

    $options = '<option value="">Выберите город</option>';
    foreach ($cities as $city) {
        $options .= '<option value="' . esc_attr($city->term_id) . '">' . esc_html($city->name) . '</option>';
    }

    echo $options;
    wp_die();
}

Шаг 3: JavaScript для обработки события изменения

Создайте файл custom-meta-boxes.js в папке вашего шаблона и добавьте следующий код:

jQuery(document).ready(function($) {
    $('#country_select').change(function() {
        var countryID = $(this).val();

        $.ajax({
            type: 'POST',
            url: ajax_object.ajax_url,
            data: {
                action: 'get_cities',
                country_id: countryID
            },
            success: function(response) {
                $('#city_select').html(response);
            }
        });
    });
});

Шаг 4: Сохранение данных

Убедитесь, что вы сохраняете выбранные страны и города при сохранении поста. Добавьте следующий код для сохранения данных метабоксов:

function save_custom_meta_boxes($post_id) {
    if (isset($_POST['country_select'])) {
        update_post_meta($post_id, 'country_select', sanitize_text_field($_POST['country_select']));
    }
    if (isset($_POST['city_select'])) {
        update_post_meta($post_id, 'city_select', sanitize_text_field($_POST['city_select']));
    }
}
add_action('save_post', 'save_custom_meta_boxes');

Заключение

Теперь у вас есть полностью функциональная система для синхронизации таксономий "Страны" и "Города" на странице редактирования поста. При выборе страны в метабоксе "Страна" метабокс "Города" обновляется с учетом выбранной страны, а при создании нового контента пользователи видят сообщения-индикаторы. Не забудьте протестировать все изменения и убедиться, что всё работает правильно.

Оцените материал
Добавить комментарий

Капча загружается...