Кажется, мой AJAX работает нормально, но как запустить PHP-скрипт на каждом AJAX?

Question

Я пытаюсь использовать AJAX для заполнения своей веб-страницы по нажатию кнопки, у меня она есть на данный момент, так что она вытягивает соответствующее число через атрибуты данных, но это несколько бесполезно, так как я не могу заставить его работать с моим скриптом (запрос WP). AJAX, по сути, просто дает идентификатор термина таксономии при нажатии кнопки. Есть ли что-то, что я скучаю, что кто-нибудь может заметить? Я буквально занимался этим около 12 часов, поэтому мой мозг полностью измотан !!

Я уже пытался использовать data: { action: 'get_products_to_screen', term_id: $(this).data('id') }, а также

xhr.open('POST', url);
        xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
        xhr.send('term_id='+this.getAttribute('data-id'));

и

`jQuery(document).ready(function($){
        $('.product-checkbox').click(function(){
            var product_checkbox = $(this).data('id');
            $('#server_response').load(url, {
                ajax_term_id: product_checkbox,
            });
        });
    });

Я ожидаю, что когда я нажму кнопку, содержимое на странице будет заменено выводом моего скрипта с результатами $ _POST, но фактическим выводом будет просто число при нажатии.

Вот мой текущий код после некоторых настроек:

PHP - WP_QUERY

<?php

// Get the products by category ID
function get_products_to_screen() {
$ajax_term_id = (int)$_POST['ajax_term_id'];
$args = array(
    'posts_per_page' => -1,
    'post_type' => 'products',
    'tax_query' => array(
        array(
            'taxonomy' => 'product_categories',
            'field' => 'term_id',
            'terms' => $ajax_term_id
        )
    ),
    'meta_query' => array(
        array(
            'key' => 'use_on_the_carousel',
            'value' => '1',
            'compare' => '=='
        )
    )
);
$product_posts = new WP_Query($args);
if($product_posts->have_posts()) : while ($product_posts->have_posts()) : $product_posts->the_post();
    echo '<div class="product-slide">';
        echo '<a href="' . get_permalink() . '">';
            echo '<img src="' . get_the_post_thumbnail_url() . '" alt="" />';
            echo '<h3>' . get_the_title() . '<h3>';
        echo '</a>';
    echo '</div>';
    endwhile;
endif;
}

?>

AJAX

<script type="text/javascript">
    jQuery(document).ready(function($){
        $('.product-checkbox').click(function(){
            var product_checkbox = $(this).data('id');
            $('#server_response').load('wp-content/themes/gorilla/template-parts/products-carousel.php', {
                ajax_term_id: product_checkbox,
            });
        });
    });
</script>

HTML

<div id="product-slider-wrapper">
    <?php
    $field = get_field_object('categories', 'option');
    if( $field['choices'] ): ?>
    <div class="bg--black">
        <div class="wrapper bg--black pb--0">
            <ul class="product-categories">
            <?php foreach( $field['choices'] as $value => $label ): ?>
                <li class="product-checkbox checkbox-id__<?php echo $value; ?>" data-id="<?php echo $value; ?>"><a href="#!"><?php echo $label; ?></a></li>
            <?php endforeach; ?>
            </ul>
        </div>
    </div>
    <?php endif; ?>
    <div class="bg--black">
        <div class="wrapper bg--black pt--0">
            <div id="server_response" class="product-slider">

            </div>
        </div>
    </div>
</div>

В настоящее время пытается:

<script type="text/javascript">
    jQuery(document).ready(function($){
        $('.product-checkbox').click(function(){
            var product_checkbox = $(this).data('id');

            $.ajax({
                url: url_path,
                type: 'POST',
                data: { 'call_function': 'yes', 'ajax_term_id': product_checkbox }
            });
        });
    });
</script>

PHP

if (isset($_POST['call_function'])) {
    echo get_products_to_screen($_POST['ajax_term_id']);
}