使用两个 Bloodhound 数据源引导预输入答案

【问题标题】：Bootstrap typeahead with two bloodhound datasource使用两个 Bloodhound 数据源引导预输入
【发布时间】：2016-07-11 18:50:54
【问题描述】：

我有一段代码在我的页面加载时从后端获取信息

//Bloodhound - Fetches all Project numbers for the current user
        var prsysList = new Bloodhound({
            datumTokenizer: Bloodhound.tokenizers.whitespace,
            queryTokenizer: Bloodhound.tokenizers.whitespace,
            prefetch: {
                url: "../Helper/LookUpProjectNumber/",
                cache: false
            }
        });


        //Typeahead on project numbers
        $('.typeahead').typeahead({
            hint: true,
            highlight: true,
            minLength: 1
        },
            {
                name: 'prsys',
                source: prsysList
            });

现在当用户选择一个值时，我想根据他之前的选择来限制他未来的选择。为此，我有另一只猎犬返回信息更新列表

//Bloodhound - Fetches all Project numbers for the current user
            var newPrsysList = new Bloodhound({
                datumTokenizer: Bloodhound.tokenizers.whitespace,
                queryTokenizer: Bloodhound.tokenizers.whitespace,
                prefetch: {
                    url: '../Helper/GetCommonPrsys?prsys=' + encodeURIComponent($selectedPrsys),
                    cache: false
                }
            });


            //Init the new variable
            newPrsysList.initialize();

            //Rebind all Typeaheads on project numbers
            $('.typeahead').typeahead({
                hint: true,
                higlight: true,
                minlength: 1
            },
                {
                    name: 'prsys',
                    source: newPrsysList
                });

我的问题是，尽管我的第二只猎犬有更新版本的数据可供用户选择，但列表并未更新。

我在这里做错了吗？

最好的

【问题讨论】：

标签： typeahead.js typeahead bootstrap-typeahead bloodhound

【解决方案1】：

我最初的想法是简单地创建第二个 Bloodhound 变量并用它输入我的输入，希望源会自动更新（如上面的问题中所述）。事实证明不是这样，我的 typeaheads 数据没有更新。

为了让它工作，我必须做一个单独的 ajax 查询，将结果存储到一个 jQuery 变量中，使用 jQuery 变量创建一个 Bloodhound（使用本地），最后输入我的预输入。

$.ajax({
                url: "../Helper/FunctionName",
                data: ({ variable1: $var1 }),
                type: "GET",
                success: function (data) {

                    //Destroy all typeaheads
                    $('.typeahead').typeahead('destroy');

                    var newData= new Bloodhound({
                        datumTokenizer: Bloodhound.tokenizers.whitespace,
                        queryTokenizer: Bloodhound.tokenizers.whitespace,
                        local: data
                    });


                    //Init the new variable
                    newData.initialize();

                    //Rebind all Typeaheads on project numbers
                    $('.typeahead').typeahead({
                        hint: true,
                        higlight: true,
                        minlength: 1
                    },
                        {
                            name: 'data',
                            source: newData
                        });


                    return false;
                },
                error: function (data) {
                    //Destroy all typeaheads
                    $('.typeahead').typeahead('destroy');
                    return false;
                }
            });

IMO 这应该需要几分钟才能实现，但我想要么我没有找到更简单的解决方案，要么负责 typeaheads 的人没有实现数据源更新。

祝你好运

【讨论】：