Select2多重选择重复值 [英] Select2 multiselect duplicates values

问题描述

http://jsfiddle.net/tXFbk/2/

HTML：

<div class="control-group">
    <label for="some_id" class="control-label">Some ID</label>
    <div class="controls">
        <input type="text" id="some_id" name="some_id" class="span4"/>
    </div>
</div>

JS：

$(function() {
    $('#some_id').select2({
        allowClear: true,
        placeholder: 'Some ID',
        minimumInputLength: 2,
        multiple: true,
        data: [
            {id: 1, text: 'some text'},
            {id: 2, text: 'some other text'},
            {id: 3, text: 'some more text'}
        ]
    });
    $('#some_id').select2('data', [
        {'id':1,'text':'some text'}
    ]);

    console.log($('#some_id').select2('val'));
});

首次加载时，它会复制值，清除值后，它不会从输入中清除。另外，如果你添加一个项目（例如一些更多的文本），然后删除它，它不会从输入值清除它。有什么办法让它停止重复价值观吗？
还有一件事 - 如何禁止添加已添加的项目？

On first load it duplicates values and after clearing value it doesn't clear it from input. Also if you add an item (eg. "some more text") and then remove it, it doesn't clear it from input value. Is there any way to make it stop duplicating values? One more thing - how to disable adding already added items?

推荐答案

检查以下 / strong>事件，并在 createSearchChoice

Check the following On Selecting event, and setting the isNew property in createSearchChoice

中设置 isNew 属性，让我知道如果它解决了您的问题

let me know if it resolved your issue

$('#some_id').select2({
            tags: true,
            tokenSeparators: [","],
            createSearchChoice: function (term, data) {
                if (term.trim().length > 0) {
                    if ($(data).filter(function () {
                      return this.text.toLowerCase().localeCompare(term.toLowerCase()) === 0;
                    }).length === 0) {
                        return {
                            id: term,
                            text: term,
                            isNew: true // this is necessary to check if the item is newly added or not
                        };
                    }
                }
            },
            multiple: true,
            minimumInputLength: 1,
            allowClear: true,
            data: [
        {id: 1, text: 'some text'},
        {id: 2, text: 'some other text'},
        {id: 3, text: 'some more text'}
    ],
        }).on("select2-selecting", function (e) {
            var tagId = '';
            if (e.choice.isNew) {
                self.AddTagToDatabase(e.choice.text);
            } else {
                var isValidTag = true;
                $(config.element[0] + ' ul li').find('div').each(function (index, item) {
                    if ($(item).html().toLowerCase().trim() == e.choice.text.toLowerCase().trim()) {
                        isValidTag = false;
                        e.choice.text = '';
                        return;
                    }
                });
            }
        })

这篇关于Select2多重选择重复值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！