4

jQuery UI で新しいオートコンプリート機能を使用しようとしていますが、いくつか問題があります。

DB からデータを取得することはできます (FireBug で確認できます) が、ドロップダウン リストを表示する (またはデータを警告する) ことはできません。

これは私のjQueryコードです:

  jQuery('#brand_search').autocomplete({
            source: "http://mysite.com/wp-content/themes/storelocator/include/jquery.search.php?instance=brand",
            minLength: 2,
            delay: 50,
            select: function(e, ui) {
              alert(ui);
            }
        });

そして、これは私のPHPコードです:

/* ------------------ Brand Autosuggest ------------------------- */
  function autosuggestBrand($dal)
  { 
    $result = $dal->getRowBySearch('sl_label','name', $this->term);   
    $brands = array();

    if(mysql_num_rows($result)>0) 
    {
      while($row = mysql_fetch_assoc($result)) 
      {
          array_push($brands, array(
            "id"      => $row['id'], 
            "name"    => html_entity_decode($row['name'], ENT_QUOTES, 'UTF-8') )
        );
      }     
    }
    echo json_encode($brands);          
  }

次の 2 つのガイドを見ました:
http://www.jensbits.com/2010/03/29/jquery-ui-autocomplete-widget-with-php-and-mysql
http://net.tutsplus.com/tutorials /javascript-ajax/how-to-use-the-jquery-ui-autocomplete-widget

しかし、取得したデータを表示/警告する方法はまだよくわかりません。

これは次の結果です。echo json_encode

[
  {"id":"4642","name":"Mo Koshji"},
  {"id":"4627","name":"MO-A"},
  {"id":"4626","name":"MO'CYCLE"},
  {"id":"4628","name":"mo851"},
  {"id":"4629","name":"Mob Action"}
]
4

2 に答える 2

3

jquery-autocomplete の正しい json 出力を取得するには、php 配列を次のように修正します。

array_push
(
   $brands,
   array
   (
      "label"  => $row['id'], 
      "value"  => html_entity_decode($row['name'], ENT_QUOTES, 'UTF-8') )
    );
);

ドキュメントで指定されているように、jquery オートコンプリートは、オートコンプリートを実行するためにこれらの json プロパティ名を必要とするためです。

ローカル データは、文字列の単純な配列にすることも、配列内の各項目のオブジェクトを含み、ラベルまたは値のプロパティ、またはその両方を使用することもできます。label プロパティが提案メニューに表示されます。

http://jqueryui.com/demos/autocomplete/#custom-data

于 2011-01-26T22:52:31.223 に答える
0

コードを次のように変更します(クリックイベントハンドラーから取り出します)。

jQuery(function()
{  
 jQuery('#brand_search').autocomplete({
        source: "http://mysite.com/wp-content/themes/storelocator/include/jquery.search.php?instance=brand",
             minLength: 2,
             delay: 50,
             select: function(e, ui) {
               alert(ui);
              }         
 }); 
});
于 2011-01-26T22:04:56.777 に答える