2011-02-08 5 views
4

script.aculo.usのオートコンプリートでは、サーバーの応答が<ul>のリストであると想定しています。この動作を拡張または置き換えて、XMLまたはJSONのドキュメントであるサーバーレスポンスを取る方法がありますか?scriptaculousオートコンプリートを拡張するには?

オートコンプリートリストにフッタを追加できるように、オートコンプリータのレンダラを拡張する方法もありますか?

答えて

3

はい、script.aculo.usのオートコンプリートの動作を拡張できます。これを行うには、onCompleteメソッドをjsonデータを処理するコードでオーバーライドし、<ul> -listを作成します。このリストはupdateChoicesに送信されます。

は、あなたが「U」を検索するときに、次のJSONレスポンスを取得します言ってやるがいい。

[ 
    "Unicorn", 
    "University" 
] 

上の応答を処理することができますAjax.Autocompleterの拡張の例:

var MyCompleter = Class.create(Ajax.Autocompleter, { 

    initialize: function($super, id_search, id_list, url, options) { 
     $super(id_search, id_list, url, options); 
    }, 

    onComplete: function(response) { 
     var text = response.responseText; 
     if (text.isJSON()) { 
      this.handleJSON(text.evalJSON()); 
     } 
     // else do nothing 
    }, 

    handleJSON: function(json) { 
     var htmlStr = '<ul>'; 
     json.each(function(item) { 
      htmlStr += '<li>'; 
      htmlStr += item; 
      htmlStr += '</li>'; 
     }); 
     htmlStr += '</ul>'; 
     this.updateChoices(htmlStr); 
    } 

}); 

replace autocompleter's width reset behaviourの例もあります。

関連する問題