2017-12-17 9 views
0

私のウェブサイトで都市を検索するときにオートコンプリート検索を実装しようとしています(カープールしています)。私は私が買ってあげる/都市/パリに行けばexempleについてSelect2、Symfony:リモートデータを使ってオートコンプリートができない

/** 
* @Route ("/city/{term}") 
*/ 
public function searchCity($term) 
{ 
    $query = $this->getDoctrine()->getRepository('App:Ville') 
     ->createQueryBuilder('v') 
     ->select('v.id, v.nomReel AS text') 
     ->where('v.nomSimple LIKE :term') 
     ->setParameter('term', $term.'%') 
     ->getQuery() 
     ->getResult(); 

    $query = array('results' => $query); 
    return new JsonResponse($query); 
} 

{"results":[ 
     {"id":30438,"text":"Paris"}, 
     {"id":29427,"text":"Paris-l\u0027H\u00f4pital"}, //I know single quotes 
     {"id":33294,"text":"Parisot"},     //don't work 
     {"id":33531,"text":"Parisot"}]} 

の選択: 私は都市でJSONを返すコントローラsearchCityを作っ

<div class="container"> 
    <select id="citySelect" class="select2 select2-dropdown select2-search" name="term"> 
    </select> 
</div> 

javascript:

 $(document).ready(function(){ 
      $("#citySelect").select2({ 
       placeholder: "Select city", 
       ajax: { 
        dataType: "json", 
        url: function (params) { 
         return '/city/' + params.term; 
        }, 
        processResults: function (data) { 
         return { 
          results: $.map(data, function(obj) { 
           return { id: obj.ime, text: obj.ime }; 
          }) 
         }; 
        } 
       } 
      }); 
     }); 

都市を検索すると、何も表示されません(検索中...と何も表示されません) コンソールログでデータが表示され、整形されていることがわかりますが、都市がドロップダウンメニューに表示されません。 私の問題は私のJavaScriptコードとselect2の理解にあると思います。

よろしく

UPDATE:

JS:

  $(document).ready(function(){ 
      $(".select2").select2({ 
       placeholder: "Select city", 
       ajax: { 
        dataType: "json", 
        url: function (params) { 
         return '/city/' + params.term; 
        }, 
        processResults: function (data) { 
         return { 
          results: data.results //return data directly 
         }; 
        } 
       } 
      }); 
     }); 

答えて

0

あなたは

return { id: obj.id, text: obj.text }; 

代わりの

return { id: obj.ime, text: obj.ime }; 
を望んでいたデータを変換するとき、私は推測します

はまた、(テストしていません)あなたはおそらく可能性があり掲載JSONを見ているだけで

processResults: function (data) { 
    return { 
     results: data.results; 
    }; 
} 
+0

はすべてが動作するようになりました、ありがとうございます。 – napoleon

関連する問題