如何扩展scriptaculous自动完成程序?

时间:2011-02-08 10:59:07

标签: autocomplete scriptaculous

script.aculo.us中的自动填充程序期望服务器响应是<ul>列表。有没有办法让我扩展或替换此行为,以便它可以采取XML或JSON文档的服务器响应?

是否还有一种方法可以扩展自动完成程序的渲染器,以便我可以在自动填充列表中添加页脚?

1 个答案:

答案 0 :(得分:3)

是的,您可以扩展script.aculo.us的自动填充程序的行为。您可以通过使用处理json数据的代码覆盖onComplete方法并为您创建<ul> - 列表来完成此操作。然后应将此列表发送到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的例子。

相关问题