编程语言
首页 > 编程语言> > javascript-允许在标记模式下执行select2 jquery ajax重复标记

javascript-允许在标记模式下执行select2 jquery ajax重复标记

作者:互联网

我正在使用select2-jquery从服务器(ajax)带来多个项目,并允许用户选择其中的几个项目,效果很好,但是我不能多次选择任何给定的标签,这是我将粘贴一些我的代码,希望对您有所帮助.我已经检查了ajax请求,并且可以在相同的搜索条件下看到从服务器返回的相同数据,但是一旦选择了一个项目,select2将不再显示它

这是我观点的一部分:

<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版本:3.4.5,因此这方面的任何更改都将非常痛苦

提前致谢

解决方法:

在通过select2代码进行了大量搜索和调试之后,我找到了一种方法(修改),方法是删除css类.select2-selected,以防止已显示的选定元素再次显示.我知道这不是最好的解决方案,但是它现在正在起作用.我真的很欢迎任何改进或更好的解决方案

标签:jquery-select2,javascript,jquery
来源: https://codeday.me/bug/20191028/1954027.html