jQuery автозаполнение ajax не создает выпадающий список выборок из php

#php #ajax #json #jquery-ui #autocomplete

#php #ajax #json #jquery-пользовательский интерфейс #автозаполнение

Вопрос:

Я, как новичок, борюсь с автозаполнением, которое не создает выпадающий список с параметрами выбора. Полный код состоит из двух этапов — пользователь выбирает страну с помощью переключателей, затем запускает автозаполнение для выбора штата / провинции. В Firefox, код страны и ввод состояния публикуются в php-скрипте, запрос выполняется корректно с использованием элементов скрипта country и state, создается ответ. Автозаполнение не создает выпадающий список с выбранными элементами. Firefox выдает сообщение об ошибке синтаксического анализа и неправильное сообщение JSON из my error: alert. Когда я помещаю элементы ответа в JSONLint, он говорит, что элемент является допустимым JSON. Firefox показывает правильное содержимое в массивах запросов, когда я меняю страну и изменяю ввод состояния. Я скопировал функцию success и опцию select, но я не уверен в них. Предупреждение в опции выбора не срабатывает. Была бы признательна за помощь в получении заполненного выпадающего списка. Вот код:

Автозаполнение jQuery:

     $("#stateProvince").autocomplete
    ({ 
        source: function( request, response )
        {           

            $.ajax(
                            { 
                url: "getStateProvince.php",
                data: {
                                          term: request.term,   
                                          country: $('input[name=country]:checked').val(),    
                                          },        
                type: "POST",  
                dataType: "json",
                error: function(x,y,z) {
                  alert(x 'n' y 'n' z);};
                success: function( data ) 
                {
                    response( $.map( data, function( item ) 
                    {
                        return{
                                                      label: item.label,
                                                      value: item.value
                                                      }
                    }));
                }
            });             
        },
        minLength: 2,
        select: function (event, ui)   //is this select necessary?  correct?   return true or false?
                {
                alert('|'   ui.item   '|2nd');
                $("#stateProvince").val(ui.item.value);
                return;
                }
                 });
  

выбранный php:

     while ($row = mysql_fetch_array($fetch, MYSQL_ASSOC)) 
    {
/* In each row, pull stateProvinceNameInEnglish and stateProvinceAbbreviation. */             
        $row_array['label'] = $row['stateProvinceNameInEnglish'];  
        $row_array['value'] = $row['stateProvinceAbbreviation'];

        array_push($return_arr,$row_array);
    }
  

}
/* Возвращает результаты состояния или провинции в виде массива, закодированного в json. */
echo json_encode($return_arr);

Комментарии:

1. Примером данных, возвращаемых из json_encode ($return_arr), является [{«label»: «Alabama»,»value»:»AL»},{«label»: «Alaska», «value»: «AK»}] Является ли это правильным и читаемым функцией success?

2. Исправлено! Проблема заключалась в том, что мой php возвращал тестовую информацию и некоторую информацию о заголовке. При удалении php возвращает только массив объектов JSON, а затем начинает работать выпадающее окно автозаполнения. Живи и учись.

Ответ №1:

Вы пробовали это так :

 public function echoPhpArrayForAutocomplete(){
    foreach($yourArray as $row){
        $string .= '{';
    $string .= '"label" : "'.$row['stateProvinceNameInEnglish'].'",';
    $string .= '"value" : "'.$row['stateProvinceAbbreviation'].'",';
    $string .= '"additionlInfo" : "'.$row['additionalInfo'].'"';
    $string .= '},';
    }
    echo rtrim($string, ',');
}
  

Чем вы создаете массив, подобный этому, в

 <script>
    var arrayFromPhp = [ <?php echoPhpArrayForAutocomplete(); ?> ];
</script>
  

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

 $('#stateProvince').live('keyup.autocomplete',function(){
    $input = $(this);

$input.autocomplete({
    minLength: 0,
    source:  arrayFromPhp , // Array with object describing the keywords. Defined with php in the view file
     }).data( "autocomplete" )._renderItem = function( ul, item ) {
    return $( "<li></li>" )
    .data( "item.autocomplete", item )
    .append( "<a>" item.label "</a>" )
    .appendTo( ul )
    .bind();
  }
});
  

Вы даже можете поместить ‘additionInfo’ в .append( «» item.label «» ) следующим образом
.добавьте ( «тег» item.additionInfo «закрыть тег»), и это будет показано в выпадающем списке… Я не знаю, помогло ли это, но я на работе, и сейчас у меня больше всего времени, которое я мог бы уделить… Если это не помогло, я был бы рад помочь позже. С уважением.

Комментарии:

1. О … я только что увидел, что вы исправили проблему … nvm … 🙂

Ответ №2:

jQuery:

 $("#stateProvince").autocomplete({ 
        source: function( request, response )
        {           
            $.ajax({ 
                url: "getStateProvince.php",
                data: {
                      term: request.term,   
                      country: $('input[name=country]:checked').val(),    
                },        
                type: "POST",  
                dataType: "json",
                error: function(x,y,z) {
                    alert(x 'n' y 'n' z);
                },
                success: function( data ) 
                {
                    response(data);//<== Change Here
                }
            });             
        },
        minLength: 2,
        select: function (event, ui){
            alert('|'   ui.item   '|2nd');
            $("#stateProvince").val(ui.item.value);
            return;
        }
    });
  

PHP:

 while ($row = mysql_fetch_array($fetch, MYSQL_ASSOC)){            
    $row_array['label'] = $row['stateProvinceNameInEnglish'];  
    $row_array['value'] = $row['stateProvinceAbbreviation'];
    array_push($return_arr,$row_array);
}
echo json_encode($return_arr);