javascript - 在codeigniter中自动完成搜索

嗨，我正在codeigniter中创建一个自动填充搜索字段，

这是我的看法：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js" ></script>

<script>
$(document).ready(function() {
    $(function(){
        $( "#text" ).autocomplete({
            source: function(request, response) {
                $.ajax({
                url: "http://localhost/new/index.php/travels/search_fields",
                data: { term: $("#text").val()},
                dataType: "json",
                type: "POST",
                success: function(data){
                    response(data);
                }
            });
        },
        minLength: 2
        });
    });
});
</script>
</head>

<body>
<form method="post">
 <input type="text" name="text" id="text" autocomplete="off" >
</form>
</body>
</html>

这是我的控制器：

    function search_fields(){
    $term = $this->input->post('term', TRUE);
    $data['var']= $this->Travel->search_field($term);
    echo json_encode($data['var']);

}

这是我的模型：

 function search_field($term){
    $this->db->distinct();
    $this->db->select("destination");
    $this->db->from('travels_detail');
    $this->db->like('destination', $term);
     $this->db->group_by('travels_detail.destination');
    $query = $this->db->get();
    return $query->result();

}

我得到一个空的下拉列表，我在哪里做错了？ Ajax或库等有什么问题吗？请有人帮助我。

最佳答案

在模型返回result_array：

return $query->result_array();

在控制器中：

$search_data = $this->Travel->search_field($term);
echo json_encode($search_data);

ajax成功后，有些变化：

success: function(data){
   var resp = $.map(data,function(obj){
        return obj.destination;
   });
   response(resp);
}

关于javascript - 在codeigniter中自动完成搜索，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/40889892/

在Codeigniter中

javascript - 在codeigniter中自动完成搜索