Неожиданный токен <в ошибке JSON с автозаполнением Wordpress Jquery

Question

Я пытаюсь заставить скрипт автозаполнения JQuery работать в Wordpress.Я считаю, что у меня все настроено правильно, так как я получаю ошибку при вводе данных в поле ввода, но затем я получаю следующую ошибку.Итак, я предполагаю, что что-то не так с JSON, но я просто не уверен, как отладить это.

Uncaught SyntaxError: Unexpected token < in JSON at position 0
        at JSON.parse (<anonymous>)
        at Function.n.parseJSON (jquery.js?ver=1.12.4:4)
        at Function.a.parseJSON (jquery-migrate.min.js?ver=1.4.1:2)
        at Object._transformResult [as transformResult] (jquery.autocomplete.js?ver=4.9.8:133)
        at Object.<anonymous> (jquery.autocomplete.js?ver=4.9.8:584)
        at i (jquery.js?ver=1.12.4:2)
        at Object.fireWith [as resolveWith] (jquery.js?ver=1.12.4:2)
        at y (jquery.js?ver=1.12.4:4)
        at XMLHttpRequest.c (jquery.js?ver=1.12.4:4)

Вот возвращаемый JSON:

["Hello world!","Email Notification","Email Notification","Formidable Style","Email Notification","Email Notification","Email Notification","Chapter Maintenance - Admin View","Chapter Info - All","Featured Members"]

Из других постов, которые я посмотрел на комментарий, он анализируется неправильно, но я не могу определить из своего исследования, как решить эту проблему.

Вот Jquery:

jQuery(document).ready(function($) {    

    $('#autocomplete-id').autocomplete({
        source: function(name, response) {
            $.ajax({
                type: 'POST',
                dataType: 'json',
                url: '/wp-admin/admin-ajax.php',
                data: 'action=get_listing_names&name='+name,

                success: function(data) {
                    response(data);

                }
            });

        }
    });

});

Вот функция в WordPress functions.php, которую я использую для возврата JSON через admin-ajax.php

add_action('wp_ajax_nopriv_get_listing_names', 'ajax_listings');
add_action('wp_ajax_get_listing_names', 'ajax_listings');


    function ajax_listings() {
        global $wpdb; //get access to the WordPress database object variable

        //get names of all businesses
        $name = $wpdb->esc_like(stripslashes($_POST['name'])).'%'; //escape for use in LIKE statement
        $sql = "select post_title 
            from $wpdb->posts 
            where post_status='publish' LIMIT 10";

        $sql = $wpdb->prepare($sql, $name);

        $results = $wpdb->get_results($sql);

        //copy the business titles to a simple array
        $titles = array();
        foreach( $results as $r )
            $titles[] = addslashes($r->post_title);



        echo json_encode($titles); //encode into JSON format and output

        die(); //stop "0" from being output
    }

Я попытался console.log (data) в область успеха,но все, что я получаю, это ошибка без каких-либо данных.

Когда я смотрю на вкладку Сеть, я вижу запросы, когда я вводю букву в поле ввода, но они показывают только: query = a или? Query = b.

ЕслиЯ нажимаю на одну из них, она загружает ту же самую страницу, на которой я сейчас нахожусь (с полем ввода автозаполнения) с? Запросом =, прикрепленным к его концу, так что это выглядит неправильно.

Я просто не уверен, почему, хотя, если он настроен правильно для получения данных от admin-ajax.php.

Мой главный вопрос, что я могу сделать, чтобы отладить этодальше?

Answer 1

Вот мой код, может быть, это поможет вам.

JS-файл (global.js) Код

jQuery(document).ready(function($) {    

var searchRequest;
$('#autocomplete-id').autoComplete({
    minChars: 2,
    source: function(name, result){
        try { searchRequest.abort(); } catch(e){}
        searchRequest = $.post(global.ajax, { name: name, action: 'get_listing_names' }, function(res) {
            result(res.data);
        });
    }
});

});

Файл Functions.phpкод

    <?php
/**
 * Enqueue scripts and styles.
 *
 * @since 1.0.0
 */
function ja_global_enqueues() {
    wp_enqueue_style(
        'jquery-auto-complete',
        'https://cdnjs.cloudflare.com/ajax/libs/jquery-autocomplete/1.0.7/jquery.auto-complete.css',
        array(),
        '1.0.7'
    );
    wp_enqueue_script(
        'jquery-auto-complete',
        'https://cdnjs.cloudflare.com/ajax/libs/jquery-autocomplete/1.0.7/jquery.auto-complete.min.js',
        array( 'jquery' ),
        '1.0.7',
        true
    );
    wp_enqueue_script(
        'global',
        get_template_directory_uri() . '/js/global.js',
        array( 'jquery' ),
        '1.0.0',
        true
    );
    wp_localize_script(
        'global',
        'global',
        array(
            'ajax' => admin_url( 'admin-ajax.php' ),
        )
    );
}
add_action( 'wp_enqueue_scripts', 'ja_global_enqueues' );


add_action('wp_ajax_nopriv_get_listing_names', 'ajax_listings');
add_action('wp_ajax_get_listing_names', 'ajax_listings');


function ajax_listings() {
    global $wpdb; //get access to the WordPress database object variable

    //get names of all businesses
    $name = $wpdb->esc_like(stripslashes($_POST['name'])).'%'; //escape for use in LIKE statement
    $sql = "select post_title 
        from $wpdb->posts 
        where post_status='publish' LIMIT 10";

    $sql = $wpdb->prepare($sql, $name);

    $results = $wpdb->get_results($sql);

    //copy the business titles to a simple array
    $titles = array();

    foreach( $results as $r ){
        $titles[] = addslashes($r->post_title);
    }

    wp_send_json_success( $titles );        

}