1

Twitter Typeahead示例页面展示了如何通过 Typeahead 使用多个数据集。local这是使用数据源选项的工作示例代码：

var nbaTeams = new Bloodhound({
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace('team'),
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    local: []
});

var nhlTeams = new Bloodhound({
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace('team'),
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    local: []
});

nbaTeams.initialize();
nhlTeams.initialize();

$('#multiple-datasets .typeahead').typeahead({
        highlight: true
    },
    {
        name: 'nba-teams',
        displayKey: 'team',
        source: nbaTeams.ttAdapter(),
        templates: {
            empty: [
                '<div class="tt-empty-message">',
                'No Results',
                '</div>'
            ].join('\n'),
            header: '<h3 class="tt-tag-heading tt-tag-heading2">1</h3>'
        }
    },
    {
        name: 'nhl-teams',
        displayKey: 'team',
        source: nhlTeams.ttAdapter(),
        templates: {
            empty: [
                '<div class="tt-empty-message">',
                'No Results',
                '</div>'
            ].join('\n'),
            header: '<h3 class="tt-tag-heading tt-tag-heading2">2</h3>'
        }
    });

JSFIDDLE

如果您通过在页面上输入输入来尝试上述 JSFIDDLE，您将看到两个数据集显示在 typeahead 下拉列表中。

我面临的问题是，如果我将数据源更改为remote，下拉列表中只会显示第二个数据集。我已经简化了我的remote代码（实际上是使用 POST 而不是 get 来发送查询），你可以在这里看到它：

JSFIDDLE

如果你尝试这个JSFIDDLE，你会看到只有第二个数据集显示在 typeahead 下拉列表中。如果您在输入输入时查看网络流量，您会看到只发出了一个 AJAX 请求，而它应该是两个（每个数据集一个）。

当我在我的网站上查看网络流量（使用我的真实代码）时，它还显示仅对第二个数据集发出请求。因此，出于某种原因，Typeahead/Bloodhound 仅向第二个数据集发出请求，而不是为每个数据集发出一个请求。它还仅显示第二个数据集的结果（或缺少结果），而不是每个数据集。

remote使用数据源选项时，为什么多个数据集不起作用？

4

1 回答 1

1

这实际上似乎是最新版本的 Typahead (0.10.3) 的错误，因为我用 0.10.2 尝试了我的代码并且它工作正常。我在这里提交了一个错误报告。

我想我会留下我的问答，以防它帮助别人。

于 2014-07-13T22:43:59.413 回答