单击 "add" 按钮后 select2 下拉列表没有关闭

Question

我在 select2 下拉列表中添加了“添加新人”按钮

select2 代码如下所示：

  $('#subFundSelection').select2({
            width: '100%',
            placeholder: 'Select a sub-fund',
            ajax: {
                url: '/FundInfo/SearchLegalEntities',
                type: 'GET',
                dataType: 'json',
                delay: 250,
                allowClear: true,
                data: function (params) {
                    return {
                        searchTerm: params.term
                    };
                },
                processResults: function (data) {
                    return {
                        results: $.map(data.legalEntities, function (obj) {
                            return { id: obj.Id, text: obj.Text };
                        })
                    };
                },
            },
            minimumInputLength: 2
        }).on('select2:open', () => {
            $(".select2-results:not(:has(button))").append('<button id="newPersonButton" style="width: 100%" type="button" class="btn btn-primary" onClick="CreateLegalEntity()">+ Add a new person</button>')
        })

一个按钮很好地添加到下拉列表中（我不能添加图片抱歉）

当我点击这个“添加新人”按钮时，我打开了一个模式。

function CreateLegalEntity() {
  
   $('#CreateLegalEntityModal').modal('show');
}

一切正常，而不是点击后下拉列表不关闭，它出现在模式的顶部，直到我点击屏幕上的其他地方。

很抱歉没有附上截图，但是网站不允许我。

我试过：

$(this).blur() 
$(".select2").trigger('blur') 
$(".select2").trigger('change')

Answer 1

来自此处 SELECT2 的文档Methods | Select2

The close method will cause the dropdown menu to close, hiding the selectable options:

$('#subFundSelection').select2('close');

应该做你想做的事

编辑

您应该从最初创建元素的相同标识符调用 .select2('close') 方法 .select2({params});

例如：$('#div1').select2() 所以应该是 $('#div1').select2('close')

单击 "add" 按钮后 select2 下拉列表没有关闭

select2 dropdownlist doesnt close after clicking the "add" button

javascript

dropdown

jquery-select2