如果在源代码中找不到，则jquery select2将文本添加到源

Question

我希望select2表现为一种组合框。请参阅参考图片。 因此，如果用户键入字符串但在源数组中找不到，那么在输入或关闭select2时，它应该将新字符串添加到源。所以说如果之前有2个值，那么现在就会有3个。

select2就像文件打开对话框中的组合框一样

我创建了示例代码，但无法使其工作。我无法更新源代码。

JSFIDDLE：

HTML：

<div class="row">
    <div class="col-md-2">
        <input type="hidden" id="select2_sample3" class="form-control ">
    </div>
</div>

JS：

$(function () {

    var preload_data = {
        results: [{
            id: 'user0',
            text: 'Disabled User',
        }, {
            id: 'user1',
            text: 'Jane Doe'
        }]
    };

    $("#select2_sample3").select2({
        placeholder: "Select...",
        allowClear: true,
        minimumInputLength: 1,
        data: preload_data,
        query: function (query) {
            var data = {
                results: []
            }, i, j, s;
            for (i = 1; i < 5; i++) {
                s = "";
                for (j = 0; j < i; j++) {
                    s = s + query.term;
                }
                data.results.push({
                    id: query.term + i,
                    text: s
                });
            }
            query.callback(data);
        }

    }).on("select2-close", function () {
        // add to 
        console.log("close");
    });
});

Answer 1

我最近有同样的任务。这是我的解决方案：

<input type="hidden" name="trBrand" id="trBrand" class="form-control"></input>

和js代码

$('#trBrand').select2({
    placeholder: 'choose something',
    allowClear: true,
    id: function(object) {
        return object.text;
    },
    createSearchChoice:function(term, data) {
        if ( $(data).filter( function() {
            return this.text.localeCompare(term)===0;
        }).length===0) {
            return {id:term, text:term};
        }
    },
    data:preload_data
});