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

Clear search term and reload all items of Select2 input after selecting any item

本文关键字：项目 加载 Select2 输入 新加载 搜索 任何 选择 清除      更新时间：2023-09-26

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

当我输入一些搜索文本时，让我们说"vai"，然后结果项加载为"vaibhav1"，"vaibhav2"，"vaibhav3"，"vaibhav4"，重点是第一项。如果我按回车键，它会被选中。

现在我想要的是清除搜索词"vai"，并且应该刷新项目列表，显示包含所有剩余记录，包括上次搜索的项目。下面是我在 select2 输入字段的 $(document).ready(function) 下的 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文件中搜索以找到可用于此目的的功能或标志，如果你们对此有任何想法，请帮助我。如果我不清楚具体说明我的要求或方法，请告诉我。提前致谢:)

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

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

在这里，search是select2.js文件中使用的搜索词变量，每次用户选择或取消选择列表中的项目时，我都会将其设置为空白字符串。它很好地满足了我的要求。

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

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

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

除了@Enoch答案之外，我还必须在将空值设置为搜索字段以重新加载选项后触发"input"事件。

$(test).parent().find('input.select2-search__field')?.val('').trigger('input');
相关文章：