2016-08-04 11 views
0

私は最初に "bi ..."というユーザ名を返す用語 "bi"を検索しましたが、 は何も表示されません。DjangoがAjaxオートコンプリートに応答していません

search.htmlの

<html> 
<div class="ui-widget"> 
    <label for="search4">search4: </label> 
    <input id="search4"> 
</div> 

<script type="text/javascript"> 
$(function(){ 
    $("#search4").autocomplete({ 
    source: '/rating/searchresult/', 
    minLength: 2, 
    }); 
}); 
</script> 
</html> 

url.py

url(r'^searchresult/', 'rating.views.search_images'), 

views.py

def search_images(request): 
    if request.is_ajax(): 
     s = request.GET.get("term", '') 
     search_result = UploadImage.objects.filter(user__username__icontains = s)[:20] 
     search = [] 
     for result in search_result: 
      json_d = {} 
      json_d['id'] = result.id 
      json_d['name'] = result 
      json_d['value'] = result 
      search.append(json_d) 
     data = m_json.dumps(search) 
    else: 
     data = 'error' 
    mimetype = 'application/json' 
    return HttpResponse(data, mimetype) 

私は価値のAjaxを検索した場合doesnot対応し、ドロップダウンには何も返されない用語がURL

[04/Aug/2016 08:48:46] "GET /rating/searchresult/?term=bi HTTP/1.1" 200 2661 

に渡されている間、私は問題のAjaxやジャンゴ Also my content type is text html see here

+0

デバッグを試みます。 'print'と' alert'文を使って、データがどこにないかを素早く確認することができます。 –

+0

'print data'と' print s'を試しましたが、何も表示されていません。 –

+0

Djangoで問題が発生していなければ、Ajax Resopnseに何が出るのでしょうか? –

答えて

0

わかりましたが、その技術的にあなたはそれがすべて間違ってやっているされた場合を理解することはできません。

sourceの属性がautocompleteの場合、ユーザーに入力フィールドの自動補完オプションとして提供する文字列またはデータの配列が必要です。実際にあなたが何をする必要があるかというを押すことでajax応答を得るためだったとき

今あなたがやろうとしているものは、単にautocompleteのごsourceであなたのviews.pyで特定のビュークラスやメソッドに対応するurlを与えることですurlとなり、そのURLに対応するそのクラス/メソッドから必要な応答が得られます。

は今、あなたはここを参照してくださいautocomplete

のソースにこのresponseを養うでしょうかsourceautocompleteの作品 - >http://api.jqueryui.com/autocomplete/#option-source

そしてajaxの公式ドキュメント - の>http://api.jquery.com/jquery.ajax/

ドキュメント$.get() - >https://api.jquery.com/jquery.get/

だからウルのJavaScriptファイルには、次のようになります。それが正常に働いていた場合

$(document).on('ready', function(){ 
     populateSearchFieldList(); 
     // all other code according to your needs 

}); 

function populateSearchFieldList() { 

    var url = "/rating/searchresult/"; 
    $.get(url, function(response) { 

      // console.log("Success..!!"); 
      console.log(response); 

      // now in views.py, you've returned a list in which every 
      // object has an id, name and value but you 
      // want only the names in your autocomplete. So for that, first 
      // you'll have to create a list of just the names and then feed 
      // that list to the source of autocomplete. Like this 

      var searchFieldOptions = []; 
      var i = 0; 

      $.each(response,function(){ 
       searchFieldOptions.push(response[i].name); 
       i++; 
      }); 

      // and now make the source of autocomplete as 
      // searchFieldOptions like this 

      $(function(){ 
       $("#search4").autocomplete({ 
        source: searchFieldOptions, 
        minLength: 2, 
       }); 
      });    

     }); 
} 

さて、あなたはresponseあなたがsuccess機能で受信し、必要なデータを持っています。このresponsesourceとしてautocompleteとして使用することができます。単純にリストの場合、またはresponseをさらに変更して、ご希望の内容のarrayを作成することができます。

+0

thnksに返信しますが、オートコンプリート機能はどこに置くべきですか?あなたのコードで、申し訳ありませんがJS、私はjuzは、特定のブログに従ってください –

+0

私はあなたの 'オートコンプリート'機能を置くことができるあなたを示す私の答えを編集します。 –

+0

@SajnaAbubacker、更新された回答を確認してください。 –

関連する問題