wp_localize для автозаполнения с пользовательскими данными - PullRequest
Новая
       30

wp_localize для автозаполнения с пользовательскими данными

0 голосов
/ 24 октября 2018

У меня есть форма, которую я хотел бы, чтобы автозаполнение jQuery осуществляло поиск людей, которые соответствуютМне нужен адрес, указанный под ними, как Пользовательский интерфейс данных JQuery .Затем их идентификатор базы данных будет добавлен в скрытое поле для использования в форме.Я использую WordPress и пытаюсь заставить wp_localize передать массив.Я строю это, затем пытаюсь добавить это.Кажется, он работает, поскольку нет ошибок JS.Но он работает на секунду, и я получаю 404 при тестировании.

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

Вот мой php-файл для постановки в очередь и для создания массива.

function add_scripts(){
    wp_enqueue_script('jquery');

    //setting array for donor selection
    $donor_data = soco_get_donor_list ();
    $donor_array = array();
    foreach ($donor_data as $dd) {
        $entry = $dd->last_name.', '.$dd->first_name;
        $donor_array[] = array(
            'label' => $entry,
            'value' => $dd->iddonor,
            'address1' => $dd->address1
        );
    }

    wp_register_script( 'soco_js', plugin_dir_url( __FILE__ ) . 'js/soco.js' );
    wp_localize_script('soco_js', 'soco_donor_array', json_encode($donor_array)); 
    wp_enqueue_script( 'soco_js' );
    wp_enqueue_script( 'jquery-ui-autocomplete' );
}
add_action('wp_enqueue_scripts', 'add_scripts');

Тогда у меня есть это в моем файле js.

$( function() {
    $( "#donor_name" ).autocomplete({
        minLength: 3,
        source: soco_donor_array,
        focus: function( event, ui ) {
            $( "#donor_name" ).val( ui.item.label );
            return false;
        },
        select: function( event, ui ) {
            $( "#donor_name" ).val( ui.item.label );
            $( "#hdn-donor-id" ).val( ui.item.value );

            return false;
        }
    } )
    .autocomplete( "instance" )._renderItem = function( ul, item ) {
        return $( "<li>" )
            .append( "<div>" + item.label + "<br>" + item.address1 + "</div>" )
            .appendTo( ul );
    };

});

Затем, наконец, вывод HTML, который он использует. 

<div class="flex-item"><strong>Donor</strong>: <br /><input type="text" id="donor_name" name="donor_name" >
                  <input type="hidden" name="hdn-donor-id" value="'.$donor_id.'"></div

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

Когда я набираю «Смит» в поле, он не выдает никаких предложений, и через несколько секунд я вижу в консоли эту ошибку 404. 

jquery.js?ver=1.12.4:4 GET https://localhost/url.com/view-contributions/...long string of %22Name%22Othername%22...?term=Smith 404 (Not Found) send @ jquery.js?ver=1.12.4:4 ajax @ jquery.js?ver=1.12.4:4 a.isArray.string.options.source.source @ autocomplete.min.js?ver=1.11.4:11
_search @ autocomplete.min.js?ver=1.11.4:11 (anonymous) @ widget.min.js?ver=1.11.4:11 search @ autocomplete.min.js?ver=1.11.4:11 (anonymous) @ widget.min.js?ver=1.11.4:11 (anonymous) @ autocomplete.min.js?ver=1.11.4:11 c @ widget.min.js?ver=1.11.4:11 setTimeout (async)
_delay @ widget.min.js?ver=1.11.4:11
_searchTimeout @ autocomplete.min.js?ver=1.11.4:11 (anonymous) @ widget.min.js?ver=1.11.4:11 input @ autocomplete.min.js?ver=1.11.4:11 h @ widget.min.js?ver=1.11.4:11 dispatch @ jquery.js?ver=1.12.4:3 r.handle @ jquery.js?ver=1.12.4:3

jquery.js?ver=1.12.4:4 XHR failed loading: GET "https://localhost/url.com/view-contributions/...long string of %22Name%22Othername%22...?term=Smith".

Кажется, что этоочень близко, но я не уверен, куда идти дальше, расследуя.Есть ли у вас какие-либо идеи?Текущий массив составляет около 2500 записей.Это слишком много?

Это не совсем сломало это.Если я попробую «Джон», он подумает на мгновение, и я получу еще один набор ошибок.На этот раз с Джоном в конце URL.

Буду признателен за любую помощь или предложения!Спасибо!

...