Bootstrap 使用两个 bloodhound 数据源提前输入

Question

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

//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
            });

现在当用户 select 是一个值时，我想根据他以前的 selection 限制他以后的选择。为此，我有另一只猎犬 returns 我的更新信息列表

//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
                });

我的问题是，尽管我的第二个猎犬有更新版本的数据可供用户 select 使用，但列表没有更新。

我是不是做错了什么？

最佳

Answer 1

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

为了让它工作，我不得不做一个单独的 ajax 查询，将结果存储到 jQuery 变量中，用 jQuery 变量，最后提供我的预输入。

$.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 的人没有实施数据源更新。

祝你好运

Bootstrap 使用两个 bloodhound 数据源提前输入

Bootstrap typeahead with two bloodhound datasource

typeahead.js

typeahead

bootstrap-typeahead

bloodhound