1

PHP，返回一个 JSON 编码的数组

$this->load->model('car_model', 'cars');
$result = $this->cars->searchBrand($this->input->post('query'));
$this->output->set_status_header(200);
$this->output->set_header('Content-type: application/json');
$output = array();
foreach($result as $r)
    $output['options'][$r->brandID] = $r->brandName;
print json_encode($output);

输出：{"options":{"9":"Audi","10":"Austin","11":"Austin Healey"}}

JS更新：

$(".searchcarBrands").typeahead({
    source: function(query, typeahead) {
        $.ajax({
            url: site_url + '/cars/search_brand/'+query,
            success: function(data) {
                typeahead.process(data);
            },
            dataType: "json"
        });
    },
    onselect: function(item) {
        $("#someID").val(item.id);
    }
});

更新：未捕获的类型错误：对象函数 (){return a.apply(c,e.concat(k.call(arguments)))} 没有方法“进程”

如果我只输入“A”，那么 typeahead 只会显示每个结果的第一个字母（一堆 A 字母）。如果我输入第二个字母，我就什么也看不见了。

我已经尝试JSON.parse过数据或使用 data.options 但没有运气。

我究竟做错了什么？

4

3 回答 3

3

我一直在与 Bootstrap 2.2.1 进行最后一天的斗争。不管我做什么，它都行不通。对我来说，除非我在进程函数中放置断点（可能只是因为 FireBug 已打开？），否则我总是遇到进程未定义错误。

无论如何，作为一个补丁，我重新下载了 Bootstrap，省略了预输入，从这里得到预输入： https ://gist.github.com/2712048

并使用了这段代码：

$(document).ready(function() {
    $('input[name=artist]').typeahead({
        'source': function (typeahead) {
            return $.get('/7d/search-artist.php', { 'artist': typeahead.query }, function (data) {
                return typeahead.process(data);
            });
        },
        'items': 3,
        'minLength': 3
    },'json')
});

我的服务器返回这个（对于'Bo'）：

["Bo","Bo Burnham","Bo Diddley","Bo Bruce","Bo Carter",
 "Eddie Bo","Bo Bice","Bo Kaspers Orkester","Bo Saris","Bo Ningen"]

当然，现在它忽略了我的 minLength，但它会让我度过一天。希望这可以帮助。

编辑：在这里找到解决方案： Bootstrap 2.2 Typeahead Issue

使用 Bootstrap 2.2.1 中包含的预输入，代码应为：

    $(文档).ready(函数() {
        $('input[name=artist]').typeahead({
            '来源'：功能（查询，提前输入）{
                return $.get('/search-artist.php', { 'artist': encodeURIComponent(query) }, function (data) {
                    返回预输入（数据）；
                });
            },
            “项目”：3，
            “最小长度”：3
        },'json')
    });
于 2012-12-07T18:33:13.643 回答
2

这是我为使用引导程序的预输入来促进远程数据源所做的工作：

$("#search").typeahead({

    source: function(typeahead, query) {

        $.ajax({

            url: "<?php echo base_url();?>customers/search/"+query,
            success: function(data) {

                typeahead.process(data);
            },
            dataType: "json"
        });
    },
    onselect: function(item) {

        $("#someID").val(item.id);
    }
});

然后你只需要确保你的 JSON 编码的数组包含value标签的索引和id之后设置隐藏 id 的字段，比如：

$this->load->model('car_model', 'cars');
$brands = $this->cars->searchBrand($this->uri->segment(4));
$output = array();
foreach($brands->result() as $r) {

    $item['value'] = $r->brandName;
    $item['id']    = $r->brandID;
    $output[] = $item;
}
echo json_encode($output);
exit;
于 2012-11-06T13:59:14.177 回答
0

$.post 是异步的，所以你不能用户返回它。那不会返回任何东西。

于 2012-11-06T13:53:03.447 回答