Question

我的页面中有一个select2输入文本字段，我在输入字段的焦点事件上动态加载项目。

当我输入一些搜索文本时，请说“vai＆＃39;然后结果项被加载为＆＃39; vaibhav1＆＃39;＆＃39; vaibhav2＆＃39;＆＃39; vaibhav3＆＃39; vaibhav4＆＃39;专注于第一项。如果我按回车键，它会被选中。

现在我想要的是清除搜索字词＆＃39; vai＆＃39;并且应刷新显示的项目列表，其中包含所有剩余记录，包括最后搜索的项目。以下是我在$(document).ready(function)下的select2输入字段的javascript代码。

function format(item) { return item.name; };
// select2 multiple select feature for Impact Area initialization
var test = $('#impactArea'); 
$(test).select2({
    formatSelection: format,
    formatResult: format ,
    multiple: true,
    width: "612px",
    height: "50px",
    closeOnSelect : false,
    maximumSelectionSize : 20,
    ajax: { 
        type: "GET",
        url: "/progressManagement/testingIssue/impactAreaList",
        dataType: 'json',
        data: function (term) {
          return { q: term };
       },
        results: function (data) {
          return {results: data};
        }
       } ,
       initSelection: function(element, callback) { 
           var rangeList=$('#impactArea').val();
           var id=$(element).val();
            if (id!=="") {
            $.ajax("/progressManagement/testingIssue/selectedImpactArea", {
                data: { rangeList: rangeList },
                dataType: "json"
            }).done(function(data) { 
                callback(data); 
            });
            }
        } 
});

我尝试在select2js文件中搜索可以用于此的函数或标志，如果您对此有任何想法，请帮助我。如果我不清楚指明我的要求或方法，请告诉我。在此先感谢：）

Answer 1

不知何故，我找到了一种解决方法，每当输入字段值发生变化时，我就使用$(test).select2("search", "");命令清除了搜索字符串。

$(test).change(function() {
    $(test).select2("search", "");
});

此处，search是select2.js文件中使用的搜索词变量，每次用户选择或取消选择列表中的项目时，我都将其设置为空白字符串。它符合我的要求。

如果有人找到更好的解决方案，请告诉我，谢谢。

Answer 2

在 v4 中，我可以使用以下代码清除搜索字段。

$(test).change(function() {
  var searchfield = $(test).parent().find('.select2-search__field');
  searchfield.val("");
})

清除搜索词并在选择任何项目后重新加载Select2输入的所有项目

2 个答案: