找不到JQuery Select2 Item触发器

时间:2015-08-21 03:34:42

标签: jquery jquery-select2 ui-select2

我想对select2字段进行回调。我试图在我的select2组件上显示所有项目名称。但是如果用户只输入了项目的名称并且该项目不在选择输入的任何选项下,那么我想弹出一个对话框,通知他们是否要将其添加为新项目。所以我想知道这个功能是否有任何类型的回调。这就是我的想法

$('select').select2({
    onSelect: function(item) {
         if (item == null || $(this).options == 0) {
         // A dialog will prompt saying would you like to add this item?
         }
    }
});

我知道这个语法不正确但你能想到吗?我只是想知道什么是回调以确定select2中的项类型是否不存在或更好但我想要在用户输入不在select2选项上的内容时触发回调。

1 个答案:

答案 0 :(得分:3)

好的,你去吧。以下是在某种程度上有效的两种情景:

情景1:

<强> DEMO

仅在点击 newtag

时启用确认提示
$('.select2').select2({
    tags: true,
    tokenSeparators: [",", " "],
    createTag: function (tag) {
        return {
            id: tag.term,
            text: tag.term,
            isNew : true
        };
    }
}).on("select2:select", function(e) {
    if(e.params.data.isNew){
        var r = confirm("do you want to create a tag?");
        if (r == true) {
$(this).find('[value="'+e.params.data.id+'"]').replaceWith('<option selected value="'+e.params.data.id+'">'+e.params.data.text+'</option>');
        }
        else
        {
            $('.select2-selection__choice:last').remove();
            $('.select2-search__field').val(e.params.data.text).focus()
        }
    }

});

情景2:

<强> DEMO

确认clickspace,但标记已添加到列表中:

$('.select2').select2({
    tags: true,
    tokenSeparators: [",", " "]
}).on("change", function(e) {
    var isNew = $(this).find('[data-select2-tag="true"]');
    if(isNew.length){
        var r = confirm("do you want to create a tag?");
        if (r == true) {
isNew.replaceWith('<option selected value="'+isNew.val()+'">'+isNew.val()+'</option>');        
        }
        else
        {
            $('.select2-selection__choice:last').remove();
            $('.select2-search__field').val(isNew.val()).focus()
        }
    }
});
  

您需要找到一些解决方法,以便在虚假案例中添加标记。