0

经过几个小时的破译教程,我终于让 codeigniter 和 jquery 自动完成功能相互配合......有点。

Firebug 以 JSON 格式显示正确的搜索词,但下拉框未显示任何文本。如果有 2 个结果,则显示 2 个空行。

你可以在这里看到它“不工作”:http ://rickymason.net/blurb/main/home

JS:

$(document).ready(function() {
    $(function(){
        $( "#filter" ).autocomplete({
            source: function(request, response) {
                $.ajax({
                url: "http://rickymason.net/blurb/main/search/",
                data: { term: $("#filter").val()},
                dataType: "json",
                type: "POST",
                success: function(data){
                    response(data);
                }
            });
        },
        minLength: 2
        });
    });
});

控制器:

    public function search()
    {
        $term = $this->input->post('term', TRUE);
        $this->thread_model->autocomplete($term);
    }

模型:

    public function autocomplete($term)
    {
        $query = $this->db->query("SELECT tag
            FROM filter_thread ft
            INNER JOIN filter f
            ON ft.filter_id = f.filter_id
            WHERE f.tag LIKE '%".$term."%'
            GROUP BY tag");
        echo json_encode($query->result_array());
    }

希望它是一个简单的修复!

谢谢

4

2 回答 2

1

将您的代码更改为这样的东西会起作用(我已经在您的网站上测试过)

$( "#filter" ).autocomplete({
        source: function(request, response) {
            $.ajax({
            url: "http://rickymason.net/blurb/main/search/",
            data: { term: $("#filter").val()},
            dataType: "json",
            type: "POST",
            success: function(data){
               var resp = $.map(data,function(obj){
                    return obj.tag;
               }); 

               response(resp);
            }
        });
    },
    minLength: 2
});

将上面的代码块复制并粘贴到您的 firebug 控制台中,然后尝试自动完成。它会起作用的。我在你的网站上试过,它奏效了。

其次,您不需要两者$(document).ready(function() {同时$(function(){完成相同的事情。

检查jQuery UI 自动完成的这一部分

预期数据格式

来自本地数据、url 或回调的数据可以有两种变体:

字符串数组:

[“选择1”,“选择2”]

一个对象数组

标签和值属性:[ { label: "Choice1", value: "value1" },

... ]

参考:$.map

于 2012-05-29T18:44:42.027 回答
1

在 SO 上查看这个问题,您需要在响应返回上设置您的labelvalue字段。尝试安排您的 PHP JSON 输出以匹配或使用以下内容(未经测试)映射返回。

response( $.map(data, function(item){
    return {
        label: item.tag,
        value: item.tag
    };
})
于 2012-05-29T18:37:03.320 回答