如何在MVC Asp.net中使用Typeahead输入Bootstrap标签

Question

使用此脚本时遇到问题： https://github.com/bootstrap-tagsinput/bootstrap-tagsinput

我一直在尝试显示一个预加载的标签列表，用于在用户在输入字段中写入时过滤选项。我尝试使用bootstrap-tagsinput文档中的示例，但它不起作用：/。

我的意见是：

@Html.TextBoxFor(model => model.Tags, new { @class = "form-control", @data_role = "tagsinput", @id="tags" })

脚本：

<script type="text/javascript">
    $(document).ready(function () {
        var citynames = new Bloodhound({
            datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'),
            queryTokenizer: Bloodhound.tokenizers.whitespace,
            prefetch: {
                url: 'https://bootstrap-tagsinput.github.io/bootstrap-tagsinput/examples/assets/citynames.json',
                filter: function (list) {
                    return $.map(list, function (cityname) {
                        return { name: cityname };
                    });
                }
            }
        });
        citynames.initialize();

        $('#tags').tagsinput({
            typeaheadjs: {
                name: 'citynames',
                displayKey: 'name',
                valueKey: 'name',
                source: citynames.ttAdapter()
            }
        });
    });
</script>

编辑：

在bundle配置中我添加了typeahead和bootstrap标签输入的引用，就像这样：

bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
                      "~/Scripts/bootstrap.js",
                      "~/Scripts/respond.js",
                      "~/Scripts/global_script.js",
                      "~/Scripts/bootstrap-filestyle.js",
                      "~/Scripts/typeahead-0.11.1.js",
                      "~/Scripts/bootstrap-tagsinput.js"));