JQueryオートコンプリートでformatResultとformatItemオプションは何をしますか？

Question

ここで少し混乱しますが、formatResultとformatItemはJQuery Autocompleteプラグインで何をしますか？

私はコンマ区切りの文字列（Djangoから）を返す関数を持っていますが、私のオートコンプリート関数は文字列を個々のエントリ/行に分割できません。どのようにオートコンプリート関数を使ってこれを実現できますか？

例えば返された結果がオートコンプリートが表示されているものをこれと次のようになります。 - [「1」、「oneTwo」、「Onethree」、「anotherOne」]

オートコンプリートで表示するとき、私はしたいですそれは、このように分割持っている分野： - 私は私がするformatResultとformatItemを使用することができます感を持っていますが、私はそこにない良い例が存在しないか、知らない

one 
oneTwo 
Onethree 
anotherOne 

!! HTMLテンプレートで

私のコード：GETリクエストを処理するためにDajangoを使用して

function autoFill(){ 
      $("#tags").autocomplete("/taglookup/", { 
     width: 320, 
     max: 4, 
     highlight: false, 
     multiple: true, 
     multipleSeparator: " ", 
     scroll: true, 
     scrollHeight: 300 
     }); 
     } 

アム。

ガト

Answer 1

formatItemが選択されるとformatResultが入力ボックスに表示する項目をフォーマットしながら、ドロップダウンリストに表示する項目をフォーマット。デフォルトで

、オートコンプリートは、としてフォーマット指定されたURLからデータを取得するために期待：

各ラインはデータの行である

foo|bar|baz|bing 
zaz|ding|blop|grok 

。各行は、formatItemとformatResultに渡すデータです。あなたは、少なくとも抵抗のパスを取って、好きなようにデータを返すことができます。

オートコンプリートの前提条件に合わないデータを使用する場合は、（私が知る限り、文書化されていない限り）構文解析オプションを使用して、ajaxリクエストの結果を解析する関数を識別する必要があります。あなたのdjangoビューは、書式設定された文字列を返すのではなく、配列を返すように見えます。 jqueryのように、あなたの配列がそれをしたいと思いフォーマットするには：

return HttpResponse('|'.join(your_array), mimetype='text/plain') 

ここでは、オートコンプリート非標準のオートコンプリートのデータを使用して（JSON）を行うための一例である：

<script type="text/javascript"> 
    format_item = function (item, position, length){ 
    return item.title; 
    } 

// Handle data from ajax request 
prep_data = function(data){ 
    tmp = $.evalJSON(data); 
    parsed_data = []; 
    for (i=0; i < tmp.length; i++) { 
    obj = tmp[i]; 
    // Other internal autocomplete operations expect 
    // the data to be split into associative arrays of this sort 
    parsed_data[i] = { 
     data: obj , 
     value: obj.isbn13, 
     result: obj.title 
    }; 
    } 
    return parsed_data 
} 

$(document).ready(function(){ 
    $("#fop").autocomplete({ 
      url : "{% url book-search %}", 
      // undocumented 
      parse: prep_data, 
      formatItem: format_item, 
      }); 
}) 

</script> 

Answer 2

私はformatMatchを取得することができていないとformatResultはこれまでのところ動作します。私はまだそれらを使用するための '正しい'方法に取り組んでいます。ただし、回避策として、次のようにparseオプションを使用できます。この例では、formatItemとparseは機能していますが、formatResultとformatMatchは機能しません。

[ 
     {City:"St. Louis", Country:"USA", PostalCode:"63103", ID:3, 
Region:"Missouri"}, 
     {City:"St. Louis", Country:"USA", PostalCode:"63109", ID:1, 
Region:"Missouri"}, 
     {City:"St. Louis", Country:"USA", PostalCode:"63119", ID:2, 
Region:"Missouri"} 
] 

私は郵便番号のボックスに6を入力し、それはすべての3つを示しています。ここ

jQuery(function(){ 
    $('#profile-tabs_addresses_grid_b_a_PostalCode').autocomplete 
('http://test.mydomain.com/locality/postalcodes/', { 
     minChars:1, 
     delay:400, 
     cacheLength:100, 
     matchContains:true, 
     max:10, 
     formatItem:function(item, index, total, query){ 
      return item.PostalCode + ': ' + item.Region + ', ' + 
item.City + ', ' + item.Country; 
     }, 
     formatMatch:function(item){ 
      return item.PostalCode; 
     }, 
     formatResult:function(item){ 
      return item.PostalCode; 
     }, 
     dataType:'json', 
     parse:function(data) { 
         return $.map(data, function(item) { 
           return { 
             data: item, 
             value: item.PostalCode, 
             result: item.PostalCode 
           } 
         }); 
       }}); 
}); 

は、データのURLから戻ってきたJSONデータは、（空白 は見やすくするために添加）でありますオプション が正しくとしてフォーマット：

63103: Missouri, St. Louis, USA 
63109: Missouri, St. Louis, USA 
63119: Missouri, St. Louis, USA 

と私は1つのテキストボックスだけで選択 郵便Cを受け取る選択オード。