javascript - 允许select2 jquery ajax在标签模式下重复标签

Question

我正在使用 select2-jquery 从服务器 (ajax) 中获取多个项目并允许用户选择其中的几个项目，它工作正常但我不能多次选择任何给定的标签，这是我的要求粘贴我的一些代码，希望它有所帮助。我已经检查了 ajax 请求，我可以看到相同的数据在相同的搜索条件下从服务器返回，但是一旦选择了一个项目，select2 就不再显示它了

这是我的 View 的一部分:

<div class="form-group">
    @Html.LabelFor(m => m.Vals, T("Values"), new { @class = "control-label col-md-2" })
    <div class="col-md-7">
        <input id="Values" name="Values" type="hidden" style="width: 100%" data-url="@Url.Action("Action", "Controller")" />
    </div>
</div>

这是 JS 部分:

$(function () {
        var fullTemplateString = 'some template string';
        var resultTemplateString = 'other template';
        var $selectInput = $('#Values');

        initilizeSelect2($selectInput, fullTemplateString, resultTemplateString);
    });

    function initilizeSelect2($selectInput, fullTemplate, resultTemplate) {
        $selectInput.select2({
            placeholder: "Select Labs",
            minimumInputLength: 2,
            multiple: true,
            tokenSeparators: [","],
            tags: false,
            ajax: {
                url: $selectInput.data('url'),
                dataType: 'json',
                quietMillis: 250,
                data: function(term, page) {
                    return {
                        term: term,
                    };
                },
                results: function(data, page) {
                    return {
                        results: data
                    };
                }
            },
            formatSelection: function (item) {
                return format(item, resultTemplate);
            },
            formatResult: function (item) {
                return format(item, fullTemplate);
            },
            escapeMarkup: function (m) { return m; }
        });
    }

    function format(item, templateString) {
        var result = templateString
            .replace(/\^\^id\^\^/g, item.id)
            .replace(/\^\^icon\^\^/g, item.icon)
            .replace(/\^\^text\^\^/g, item.name)
            .replace(/\^\^desc\^\^/g, item.desc);

        return result;
    }

我在这个项目中广泛使用 select2 version:3.4.5 所以这方面的任何更改都会非常痛苦

提前致谢

Answer 1

通过 select2 代码进行大量搜索和调试后，我找到了一种方法(hack)通过删除 css 类 .select2-selected 来解决这个问题，它可以防止已经选择的元素再次显示。我知道这不是最好的解决方案，但它现在正在工作。我非常欢迎任何改进或更好的解决方案