javascript - twitter bootstrap typeahead 不起作用

Question

我正在使用 twitter bootstrap typeahead 并且我被卡住了，因为我没有收到任何错误，但自动完成功能不起作用。

这是我的输入字段

<input type="text" id="autocomplete" />

这是我的脚本

<script>
    $('#autocomplete').typeahead({
            source: function(process) {
                var data =  <?php Widgets::allProducts() ?>;
                process(data);
        },

        matcher: function(item) {

            return
            item.name.toLocaleLowerCase()
                .indexOf(this.query.toLocaleLowerCase()) != -1;

        },
        highlighter: function(item) {
            return item.name;

        },
        updater: function (item) {
            alert(JSON.parse(item).value);
            return JSON.parse(item).name;

        }
    });

</script>

这就是我的var data样子

var data =  [{"name":"Acne.org","id":"5"},{"name":"AcneFree","id":"6"},{"name":"Alpha Hydrox","id":"16"},{"name":"AmLactin","id":"17"},{"name":"Astara","id":"21"}];

我想要做的是列出产品名称（name在 中var data），并在选择产品后将用户重定向到产品页面（在我进入的产品 ID 的帮助下var data）id。

我只是在这个阶段迷失了，因为我没有收到任何错误。我将不胜感激任何推动正确方向的努力。