提前問題

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>