提前问题

Question

几天前，我已经开始使用twitters typea，当我希望他向他显示一个值，IE用户名或类似名称时，它运行得非常好。 当我决定要更多东西时，例如在Facebook上搜索结果的方式下拉列表中，以及在人物名称和其他信息旁边的方式，我遇到了主要问题。 尝试了几套教程，并设法完成了其中一项工作，但仅使用静态JSON文件。 我想知道我可以用SQL队列替换该JSON文件吗？

以下代码仅适用于文本：

$(document).ready(function() {
    var users = new Bloodhound({
        datumTokenizer: Bloodhound.tokenizers.obj.whitespace('username'),
        queryTokenizer: Bloodhound.tokenizers.whitespace,
        remote: 'users.php?query=%QUERY'        
    });

    users.initialize();

    $('#users').typeahead({
        hint: true,
        highlight: true     
    }, {
        name: 'users',
        displayKey: 'username',
        source: users.ttAdapter()
    }); 
});

这段代码用于JSON文件自定义显示：

$(document).ready(function () {

$('.WordpressPosts').typeahead({
    name: 'Wordpress',
    prefetch: 'test2.json',
    template: [
        '<p class="repo-tag">{{tag}}</p>',
        '<p class="repo-name">{{name}}</p>',
        '<p class="repo-description">{{description}}</p>'
    ].join(''),
    engine: Hogan
    });
});

有什么我可以解决的问题吗？ 先感谢您。

Answer 1

好的，在我使用Console来查看出什么问题之后，我找到了答案。 我没有定义车把。 现在正在工作！

我自己解决了这个问题。 这是我制作/使用的自定义Java脚本文件。

$(document).ready(function() {
    var users = new Bloodhound({
        datumTokenizer: Bloodhound.tokenizers.obj.whitespace('username'),
        queryTokenizer: Bloodhound.tokenizers.whitespace,
        remote: 'users.php?query=%QUERY'        
    });

    users.initialize();

    $('#users').typeahead({
        hint: true,
        highlight: true     
    }, {
        name: 'users',
        displayKey: 'username',
        source: users.ttAdapter(),
        templates: {
        empty: [
        '<div style="height:50px; width:330px;">',
        'Nope',
        '</div>'
        ].join('\n'),
        suggestion: Handlebars.compile('your html code, call items with {{username}}')
        } 
    }); 
});

以及您需要包括的文件：

<script src="js/hogan.js"></script>
<script src="js/handlebars-v2.0.0.js"></script>
<script src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.typeahead.js"></script>

<script src="js/typeahead.js"></script>
<script src="js/global.js"></script>