【问题标题】:How to use typeahead options in Bootstrap Tags Input如何在 Bootstrap 标签输入中使用 typeahead 选项
【发布时间】:2015-06-29 02:40:11
【问题描述】:

我正在使用Bootstrap tags inputtypeahead,我想知道如何将默认选项设置为typeaheadjs。在examples 我见过这样的:

var input = $('input');
input.tagsinput({
    itemValue: 'value',
    itemText: 'text',
    typeaheadjs: {
        name: 'engine',
        displayKey: 'text',
        source: engine.ttAdapter()
}

这里,typeaheadjs 代表一个数据集,但我如何添加基本选项,如 hinthighlightminLength强>?

【问题讨论】:

    标签: typeahead.js bootstrap-tags-input


    【解决方案1】:

    您可以将 add typeaheadjs 作为对象数组。第一个对象是选项和第二个数据集

    typeaheadjs: [ {options}, {datasets} ]

    应该这样做。

    $('input').tagsinput({
        typeaheadjs: [{
              minLength: 3,
              highlight: true
        },{
            minlength: 3,
            name: 'citynames',
            displayKey: 'name',
            valueKey: 'name',
            source: citynames.ttAdapter()
        }],
        freeInput: true
    });
    

    这是一个DEMO

    希望这会有所帮助。

    【讨论】:

    • 我明白了...感谢@DhirajBodicherla 使用examples site 中的包不起作用。它似乎已经过时了。我已经尝试使用 master 分支,它运行良好,谢谢!
    • 演示似乎无法正常工作。预输入不起作用。
    • @ctorx:它正在工作。开始输入一个单词,它会起作用
    • The demo 是功能性的,但很时髦...文本框的大小会随着您键入而改变...
    • 该演示非常适合我,但我似乎无法使用我自己的网站获得tyepahead 功能。标签有效,但我没有看到可供选择的数据列表。我什至复制并粘贴了演示以试用。
    猜你喜欢
    • 2018-05-25
    • 2016-04-11
    • 1970-01-01
    • 1970-01-01
    • 2017-09-02
    • 2016-11-24
    • 1970-01-01
    • 2012-09-05
    相关资源
    最近更新 更多