jQuery 重置 select2 值并显示占位符

Reset select2 value and show placeholder

提问by fefe

How do I set the placeholder on value reset by select2. In my example If locations or grade select boxes are clicked and my select2 has a value than the value of select2 should reset and show the default placeholder. This script is resetting the value but won't show the placeholder

如何在 select2 重置值时设置占位符。在我的示例中，如果单击了位置或等级选择框，并且我的 select2 的值比 select2 的值应重置并显示默认占位符。此脚本正在重置值但不会显示占位符

$("#locations, #grade ").change(function() {
   $('#e6').select2('data', {
     placeholder: "Studiengang w?hlen",
     id: null,
     text: ''
   });
});

$("#e6").select2({
   placeholder: "Studiengang w?hlen",
   width: 'resolve',
   id: function(e) {
     return e.subject;
   },
   minimumInputLength: 2,
   ajax: {
     url: "index.php?option=com_unis&task=search.locator&tmpl=component&<?php echo JSession::getFormToken() ?>=1",
     dataType: 'json',
     data: function(term, page) {
       return {
         q: term, // search term
         g: $('#grade option:selected').val(),
         o: $('#locations option:selected').val()
       };
     },
     results: function(data, page) {
       return {
         results: data
       };
     }
   },
   formatResult: subjectFormatResult,
   formatSelection: subjectFormatSelection,
   dropdownCssClass: "bigdrop",
   escapeMarkup: function(m) {
     return m;
   }
});

回答by AbdelMalek

You must define the select2 as

您必须将 select2 定义为

$("#customers_select").select2({
    placeholder: "Select a customer",
    initSelection: function(element, callback) {                   
    }
});

To reset the select2

重置 select2

$("#customers_select").select2("val", "");

回答by fefe

Select2 has changed their API:

Select2 已更改其 API：

Select2: The select2("val")method has been deprecated and will be removed in later Select2 versions. Use $element.val() instead.

Select2：该select2("val")方法已被弃用，将在以后的 Select2 版本中删除。改用 $element.val() 。

The best way to do this now is:

现在最好的方法是：

$('#your_select_input').val('');

Edit: December 2016Comments suggest that the below is the updated way to do this:

编辑：2016 年 12 月评论建议以下是执行此操作的更新方法：

$('#your_select_input').val([]);

回答by NorthCat

The accepted answer does not work in my case. I'm trying this, and it's working:

接受的答案在我的情况下不起作用。我正在尝试这个，它正在工作：

Define select2:

定义 select2：

$("#customers_select").select2({
    placeholder: "Select a State",
    allowClear: true
});

or

或者

$("#customers_select").select2({
    placeholder: "Select a State"
});

To reset:

重置：

$("#customers_select").val('').trigger('change')

or

或者

$("#customers_select").empty().trigger('change')

回答by M.Tae

The only thing can work for me is:

唯一对我有用的是：

$('select2element').val(null).trigger("change")

I'm using version 4.0.3

我使用的是 4.0.3 版

Reference

参考

According to Select2 Documentation

根据 Select2 文档

回答by Marcio Mazzucato

Select2 uses a specific CSS class, so an easy way to reset it is:

Select2 使用特定的 CSS 类，因此重置它的简单方法是：

$('.select2-container').select2('val', '');

And you have the advantage of if you have multiple Select2 at the same form, all them will be reseted with this single command.

而且您的优势在于，如果您在同一表单中有多个 Select2，则所有这些都将使用此单个命令重置。

回答by IlludiumPu36

With Select2 version 4.0.9 this works for me:

使用 Select2 版本 4.0.9 这对我有用：

$( "#myselect2" ).val('').trigger('change');

回答by Sachin Gend

Use this :

用这个 ：

$('.select').val([]).trigger('change');

回答by Shanka SMS

TO REMOVE SELECTED VALUE

删除选定的值

$('#employee_id').select2('val','');

---

---

TO CLEAR OPTION VALUES

清除选项值

$('#employee_id').html('');

回答by Sean

I know this is kind of an old question, but this works for the select2 version 4.0

我知道这是一个老问题，但这适用于 select2 4.0 版

 $('#select2-element').val('').trigger('change');

or

或者

$('#select2-element').val('').trigger('change.select2'); 

if you have change events bound to it

如果您有绑定到它的更改事件

回答by Zabith Rafeek

Use following to configure select2

使用以下配置select2

    $('#selectelementid').select2({
        placeholder: "Please select an agent",
        allowClear: true // This is for clear get the clear button if wanted 
    });

And to clear select input programmatically

并以编程方式清除选择输入

    $("#selectelementid").val("").trigger("change");
    $("#selectelementid").trigger("change");