Jquery在codeigniter中自动完成检索值但不显示它们答案

【问题标题】：Jquery autocomplete in codeigniter retrieving values but not displaying themJquery在codeigniter中自动完成检索值但不显示它们
【发布时间】：2012-05-29 18:18:39
【问题描述】：

经过几个小时的破译教程，我终于让 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());
    }

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

谢谢

【问题讨论】：

'not working' 不是一条错误消息，我可以从中收集任何有用的信息...
您能发布您返回的 JSON 输出吗？顺便说一句，除非 $term 在传递给您的模型之前经过适当的清理，否则您很容易受到 SQL 注入攻击。
请阅读this SO post 和相关链接。
是的，正如其他人指出的那样，更好的错误报告也会很好。检查你的 javascript 控制台，或者在浏览器状态栏中寻找一个黄色的小三角形。
您还应该在插入查询之前对值进行转义，或者使用框架提供的绑定

标签： php jquery codeigniter jquery-autocomplete

【解决方案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 autocomplete这部分

预期的数据格式

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

字符串数组：

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

对象数组

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

...]

参考：$.map

【讨论】：

【解决方案2】：

查看 SO 上的 this question，您需要在响应返回上设置 label 和 value 字段。尝试安排您的 PHP JSON 输出以匹配或使用以下内容（未经测试）映射返回。

response( $.map(data, function(item){
    return {
        label: item.tag,
        value: item.tag
    };
})

【讨论】：